bem-site / bem-forum-content-ru

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

Подходит ли bemjson в данном случае? #1123

Open rinatr1 opened 8 years ago

rinatr1 commented 8 years ago

Добрый день! Сразу говорю, документацию не читал, в философии не разбирался. Вопрос только один. Существует достаточно много js библиотек для построения интерфейса. У некоторых из них (ext.js, smartclient, webix, qooxdoo и пр.), есть возможность писать представление прямо в javascript по способу, очень похожему, который описан в bemjson. Это я считаю очень удобно, код получается чистым. А у некоторых из них сделано все это не очень красиво: аля jquery ui. Т.е цепляемся к определенным dom элементам по css селектору и прописываем в js свойства. Такой метод конечно хорош для простого сайта, но для полноценной SPA - не очень приятно. Например кнопки тулбара одна библиотека хранит в json, а сам тулбар цепляется к dom элементу, другая требует чтобы обязательно див элементы на эти кнопки и т.п.. В результате получается бардак. За примером далеко ходить не надо, посмотрите easyui, jQWidgets, kendo UI и тп. Я хочу писать подобные вещи без строчки html кода. Сможет ли bem превратить json код в что-то аля:

<body>
   <input id = ‘spinner’ class="easyui-numberspinner" 
</body>
<script>
$('# spinner’). numberspinner ({increment:10});
</script>
tadatuta commented 8 years ago

@rinatr1 да, разумеется:

[{
    tag: 'body',
    content: {
        block: 'easyui-numberspinner',
        attrs: { id: 'spinner' }
    }
},
{
    tag: 'script',
    content: "$('#spinner').numberspinner({increment:10});"
}]
rinatr1 commented 8 years ago

А возможно написать какой-нибудь компонент чтобы script генерировался сам? Просто по факту - в нем те же свойства элемена в json. Т.е вид:

   [{
            tag: 'body',
            content: {
                block: 'easyui-numberspinner',
                options:
                {
                    increment:10,
                    prefix:'руб',
                    spinAlign:'horizontal',
                    min:1,
                    max:100
                }
            }
        }]

Превращался в вышеописанный код. Притом id-шник БЭМ ему назначал самостоятельно. PS: Как тут тег для цитаты кода ставить?

tadatuta commented 8 years ago

Да, разумеется. Для проброса параметров в BEMJSON есть специальное поле js:

[{
    tag: 'body',
    content: {
        block: 'easyui-numberspinner',
        js: {
            options: {
                increment:10,
                prefix:'руб',
                spinAlign:'horizontal',
                min:1,
                max:100
            }
        }
    }
}]

Но пора уже начинать читать документацию: https://ru.bem.info/platform/i-bem/parameters/

PS: Как тут тег для цитаты кода ставить?

Это markdown — три бектика и язык: ```js.

rinatr1 commented 8 years ago

Спасибо за ответы.