Сбрасывать кэш i-bem! (с) Ваш кэп ;-)

Можно получить инстанс блока с помощью jquery и использовать его методы:

$('.selector').bem('block-name').setMod(...)

@Guria точно! Видел эту запись где-то на сайте, но не смог найти... Думал, что показалось уже мне :) Спасибо

$('.selector').bem('block-name').setMod(...)

Эта штука используется только для тестирования. Не нужно использовать ее в коде

@sipayRT а что можешь посоветовать для решения данной проблемы?

были мысли об использовании jquery триггеров

@belozyorcev до тех пор, пока страница частично на i-bem.js, а частично — нет, смысла перфекционировать, как предлагает @sipayRT, нет. полне можно жить с $().bem().

а для «чистых» проектов на i-bem действительно в таком подходе нет смысла.

@tadatuta но ведь остался еще вариан, который предложил @zxqfox - можно сбрасывать кэш элемента.

@tadatuta @belozyorcev еще не надо забывать, что .bem может неоднозначно работать при использовании js: { id } ;-) в domElem, полагаю, будут все дом ноды, а не одна, как может ожидаться. Возможно, есть и другие острые минералы, о которых мы не знаем/не задумываемся.

@zxqfox Ну мне пока больше описанного ничего не нужно :)

По поводу кэша. Как его сбросить? Это первое что пришло в голову, но как на это повлиять из вне?

@belozyorcev this.dropElemCache(), this is an instance of i-bem__dom, т.е. инстанс блока, например.

@zxqfox ну это кэш элемента. А блока?

А с модификаторами все интереснее — но есть this._modCache, может спасет. https://github.com/bem/bem-core/blob/v2/common.blocks/i-bem/i-bem.vanilla.js#L526 — ;-) веселая штука еще есть.

Так и как же сбросить кеш извне бэм блока? @zxqfox использовал $().bem() на блоке с {id:1} на разных дом нодах. Всё норм было. Имхо нормальный вариант для описанного случая. В kendo-ui используется похожий механизм: $('selector').data('widget-name') вернёт инстанс этого виджета.

@belozyorcev Я бы тоже использовал $.fn.bem() (впрочем, как и делаю), пока миграция на i-bem до конца невозможна. И педалировал бы i-bem во всех новых модулях, + постепенно перетаскивал старые в плановом режиме по паре штук (или больше) в неделю ;-) Тем более, что завязываться на приватные методы — это еще хуже.

@Guria :+1: в общем ;-)

А может кто подсказать, как при таком подходе подвязаться на событие от блока? Т.е. что-то типо этого

        var map = $('.b-map').bem('b-map');
        var switchMap = $('.switch-map');

        map.on('inited', function () {
            console.log('inited');
        });

В самом блоке карты в 'js' : 'inited' вызвается this.emit('inited')

@belozyorcev то, как ты написал, должно работать. но можно даже без этого обойтись и пользоваться тем фактом, что можно подписываться на установку модификаторов, т.е. достаточно подписать на .on({ modName: 'js', modVal: 'inited' })

Сейчас переписываю весь проект на БЭМ. Директор на студии дал добро :). Появилась возможность сделать "без костылей". Но вот загвоздка...

В шапке сайта находится переключатель. На него намиксовал map__switcher. Подвязался на событие от элемента в блоке map. Но ничего не происходит при клике. Я так понимаю, это связанно с тем, что переключатель находится снаружи блока.

П. Н. Как реализовать через события знаю. Хотел попробовать в виде элемента подвязать.

@belozyorcev чтобы заработало так, нужна связка через id в js params:

[
    {
        block: 'header',
        content: [
            /* ... */
            {
                block: 'map',
                js: { id: 'my-map' },
                mix: { elem: 'switcher' }
            }
        ]
    },
    {
        block: 'map',
        js: { id: 'my-map' } // id произвольный, но важно, чтобы совпал с id на элементе
    }
]

@tadatuta получается, что переключатель в шапке имеет следующий класс map map__switcher. map обязателен?

upd На map уже подвешены стили, которые начинают ломать внешний вид. Через deps.js не получилось указать элемент switcher, чтобы он был после блока map В классах указал большую специфичность, чтобы перекрыть стили.

.map.map__switcher

Но решение кажется не совсем удачным.

upd а вообще всё получается корявовато...

Например после показа карты я получаю такой класс у переключателя, хотя должен его скрыть.

map map__switcher header__map i-bem map_js_inited map_display

может лучшем решением было бы вынести в отдельный блок перелючатель? Чтобы не создавать путаницу...

@belozyorcev чтобы не возникало такой проблемы, достаточно основную часть карты тоже завернуть в какой-нибудь элемент и стили писать на него, а не на сам .map.

Разумеется, этот подход не единственно верный и связь можно реализовать через события, каналы или общего родителя. Но и подход с одним блоком на нескольких DOM-узлах вполне имеет право на существование.

Сделал через общего родителя. Как правильней будет подписаться на состояния блока?

this.__map = this.findBlockOutside('page').findBlockInside('map');

this.__map.on({'display': false}, this.show, this);

Ничего не происходит при закрытии карты. (Удалении модификатора display)

П.Н. Не знаю, может уже было принято решение по поиску блоков для 3-й версии...

 this.blockOutside('page').blockInside('map');

Как на счёт того, чтобы избавится от find* ?

Затупил :) Должно быть так. Заработало

this.__map.on({modName: 'display', modVal: false}, this.show, this);

@belozyorcev «через общего родителя» — это в смысле писать код в блоке-родителе. findBlockOutside — порочная практика, повышающая связанность кода. Такого нужно всячески избегать.