Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to achieve a bemhtml replace() like behaviour? #173

Closed
a-x- opened this issue Jun 22, 2016 · 7 comments
Closed

How to achieve a bemhtml replace() like behaviour? #173

a-x- opened this issue Jun 22, 2016 · 7 comments
Labels

Comments

@a-x-
Copy link

a-x- commented Jun 22, 2016

block('tabbar')(
    replace()(function() {
        return {
            block: 'tabs-menu',
            mix: this.extend(this.mix, [{
                block: 'tabbar',
                mods: this.extend(this.mods, {'show-extra': 'no'}),
                js: true
            }]),
    // ...
@a-x- a-x- changed the title How to achieve a bemhtml replace like behaviour? How to achieve a bemhtml replace() like behaviour? Jun 22, 2016
@qfox
Copy link
Member

qfox commented Jun 22, 2016

Guess, like this:

bh.match('tabbar', function(ctx, json) {
    return {
        block: 'tabs-menu',
        mix: bh.extend(ctx.mix(), [{
            block: 'tabbar',
            mods: bh.extend(ctx.mods(), {'show-extra': 'no'}),
            js: true
        }])
    };
});

@mishanga
Copy link
Member

mishanga commented Jun 22, 2016

Сатанинский шаблон.
Лучше как-то так:

bh.match('tabbar', function(ctx) {
    ctx.js(true);
    ctx.mod('show-extra', 'no');
    return {
        block: 'tabs-menu',
        mix: [].concat(ctx.json(), ctx.mix())
    };
});

@miripiruni
Copy link

Простите, что врываюсь в тред. Но шаблон на bem-xjst тоже какой-то сатанинский. @a-x- какую задачу ты хочешь решить?

Кроме того, у меня сложилось впечатление, что:

  1. Ты перепутал местам что к чему миксуешь. Проще примиксовать tabbar к tab-menu в этой ситуации, если я правильно понимаю желаемый результат.
  2. Исходный шаблон просто не работает. Я ничего не понял про за два this.extend(…) в твоём примера. this.extend(this.mix, …) писать нельзя.
  3. this.mix не существует, есть только this.ctx.mix,
  4. this.ctx.mix может быть чем угодно, но чаще всего объектом или массивом. Значит this.extend не применим. Ты наверное имел ввиду приведение к массиву и пуш в него, да?

Итого должно получится как-то так:

{
    block: 'tabbar',
    mods: { m: 'v' },
    mix: { block: 'mixed' }
}
block('tabbar')(
    def()(function() {
        this.mods['show-extra'] = 'no';
        return applyNext();
    }),
    js()(true),
    mix()('tabs-menu')
)
<div class="tabbar tabbar_m_v tabbar_show-extra_no tabs-menu mixed i-bem" data-bem='{"tabbar":{}}'></div>

Можно покрутить повертеть в Online demo: https://goo.gl/SmDSTa

@miripiruni
Copy link

@a-x- прочитай, пожалуйста, еще раз про то, что доступно в теле шаблона.

  1. Нормализованные сведения про узел на который наматчился шаблон
    this.block, this.elem, this.mods, this.elemMods
  2. this.ctx — ссылка на текущий узел из BEMJSON со всеми вытекающими.
  3. всякие хелперы в this типа extend и проч.

@a-x-
Copy link
Author

a-x- commented Jun 23, 2016

@miripiruni
а почему mix не нормализуется?

Кажется, логично ожидать доступным this.mix который будет всегда массивом.
В вырожденных случаях пустым или из одного bem-name объекта (если в bemjson была строка 'block', то объект приведённый из неё {block: 'block'})

@a-x-
Copy link
Author

a-x- commented Jun 23, 2016

а если я примиксую tabs-menu то его шаблоны же не применятся, а они нужны, т.к. я делаю наследование

https://goo.gl/azGop3

@a-x-
Copy link
Author

a-x- commented Jun 23, 2016

хочу block('tabbar').inherit('tabs-menu')....foobar()
чтобы вся магия происходила внутри

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

4 participants