bem-site / bem-forum-content-ru

Content BEM forum for Russian speak users
MIT License
56 stars 6 forks source link

Проблема генерации вложенного блока в такой же блок с помощью applyCtx #577

Closed Mr-Robby closed 9 years ago

Mr-Robby commented 9 years ago

Здравствуйте. Имеется вот такой bemjson:

({
    block: 'page-part',
    content: [{
        block: 'liquid-if',
        conditions: [{
            condition: 'blabla !=2',
            content: [{
                block: 'tatata',
                content: [{
                    block: 'liquid-if',
                    conditions: [{
                        condition: 'tata == 3',
                        content: 'Hello!'
                    }]
                }]
            }]
        }]
    }]
})

Его обрабатывает вот такой bemhtml:

block('liquid-if')(
    bem()(false),
    match(function() { return this.ctx.conditions})(
        def()(function() {
            var ctx = this.ctx.conditions,
                arr = [];
            ctx.forEach(function(item, i) {
                if (typeof(ctx[i].condition) !== 'undefined') {
                    if (i === 0) {
                        arr.push('{% if '+ ctx[i].condition +' %}')
                    } else {
                        arr.push('{% elseif '+ ctx[i].condition +' %}')
                    }
                } else {
                    arr.push('{% else %}')
                }
                arr.push(ctx[i].content)
            });
            arr.push('{% endif %}');
            return applyCtx(arr)

        })
    )
);

На выходе получаем такой html:

{% if blabla !=2 %}
<div class="tatata">
    <div></div>
</div>{% endif %}

Вопрос: из-за чего вложенный блок не применяет шаблон по моде default, хотя bem()(false) отрабатывает?

tadatuta commented 9 years ago

@Mr-Robby предположительно используется старая версия bem-xjst и/или базовых шаблонов. Я взял актуальную версию project-stub и на ней данный код генерирует:

<div class="page-part">{% if blabla !=2 %}<div class="tatata">{% if tata == 3 %}Hello!{% endif %}</div>{% endif %}</div>

PS: Шаблон можно сократить до:

block('liquid-if')(
    bem()(false),
    match(function() { return this.ctx.conditions; })(
        def()(function() {
            var conds = this.ctx.conditions;

            return applyCtx(conds.map(function(item, i) {
                return [
                    typeof(conds[i].condition) !== 'undefined' ?
                        '{% ' + (i !== 0 ? 'else' : '') + 'if '+ conds[i].condition +' %}' :
                        '{% else %}',
                    conds[i].content
                ];
            }).concat('{% endif %}'));
        })
    )
);
Mr-Robby commented 9 years ago

@tadatuta, спасибо большое! Всего лишь нужно было обновить bem-core с v2.6.0 до v2.7.0 :)