Второй день читаю мануал, смотрю форум и нет внятных примеров как организовать взаимосвязь между блоками, как подписываться на события....
Вообщем проблема: Необходимо при выборе элемента в 'Select-e' изменить иконку в блоке 'language-icon' Решил сделать модификатор 'icon' к блоку 'language-icon' в css они прописаны так:
.language-icon_icon_ru{ background-image: url('icons/flags_ru.png'); }
.language-icon_icon_en{ background-image: url('icons/flags_us.png'); }
Вот описание блока: language
.bemtree.js
block('language')({
content: () => [
{
block: 'language-icon',
mods:{ size: "24", icon: 'ru'},
js: true,
},
{
block: 'select',
mods: {
mode: 'radio',
theme: 'skay',
size: 'm'
},
mix: [
{
block: 'block_name',
elem: 'control-lang',
js: true,
},
],
width:'available',
name: 'select1',
val: 1,
options: [
{
val: 1,
text: 'Русский',
icon: {
block: 'icon',
url: 'icons/flags_ru.png'
}
},
{
val: 2,
text: 'English',
icon: {
block: 'icon',
url: 'icons/flags_us.png'
}
}
]
}
]
});
.bemhtml.js
block('language')(
js()(true),
addJs()(true),
tag()('div')
);
.deps.js
({
mustDeps: ['i-bem-dom'],
shouldDeps: ['icon', 'select',
{
block: 'select',
mods: {
mode: 'radio',
theme: 'skay',
size: 'm'
}
}]
})
.js
modules.define('language', ['i-bem-dom', 'events', 'BEMHTML', 'select'],
function(provide, bemDom, events, BEMHTML, Select, $) {
function change(e){
// ответ приходит при смене языка. 1 или 2. отлично!
console.log("lang: " + e.target.getVal());
/*
Что тут нужно написать, чтобы изменить модификатор 'icon' у блока 'language-icon' ?
*/
}
provide(bemDom.declBlock(this.name, {
onSetMod : {
'js' : {
'inited': function() {
this._events(Select).on('change', change);
}
}
},
}));
});
