Skip to content

yandex-ui/noscript-demo

Repository files navigation

noscript-demo

Демо проект для знакомства с MVW фреймворком noscript.

Setup

git clone git@github.com:yandex-ui/noscript-demo.git noscript-demo
cd noscript-demo
npm install
make
# Может потребоваться выполнить `make -B`, если на какой-то стадии криво соберутся yate шаблоны, к примеру.

Для примера:

  • файлы лежат в директории ~/reps/noscript-demo
  • эта папка видна через браузер как http://localhost/reps/noscript-demo

Открываем http://localhost/reps/noscript-demo/ (важно, что на конце указан слеш).

ns + react

Чтобы подружить ns и react можно воспользоваться noscript-react.

Декларируем вид:

ns.View.define('react-view', {
    events: {
        'ns-view-htmlinit': 'onHtmlInit'
    },
    methods: {
        onHtmlInit: function() {
            React.renderComponent(DemoComponent({}), this.node);
        },
        renderComponent: function() {
            return React.renderComponentToString(DemoComponent({}));
        }
    }
});

Прописываем в yate! шаблоне вызов метода вида:

match .react-view ns-view-content {
    _html = ns-view-call('renderComponent')
    html(_html)
}

Метод React.renderComponentToString синхронный и таким образом мы в момент рендеринга прекрасненько рендерим html для компонента, а затем на стадии ns-view-htmlinit его оживляем.

Вопросы

  • вложенные виды: самое простое - сделать react вид листовым. Есть ещё идеи делать фиктивные виды для запроса разных моделей для разных кусков вида
  • надо что-то поделать с invalidate и isValid

About

Simple demo project using noscript MVW framework

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published