Riot.js: монтирование тегов с той же переменной

Question

У меня есть 3 таможенные метки: my-tag1, my-tag2 а также my-tag3

И я использую их так:

<my-tag1>
  <my-tag2 attr1="a">
    <my-tag3 attr2="b"></my-tag3>
  </my-tag2>
</my-tag1>

Я монтирую все теги так:

riot.mount('*', { store:reduxStore });

my-tag1 может получить доступ к store но my-tag2а также my-tag3 не могу это сделать.

Однако, если я сделаю следующее, my-tag2 можешь использовать store:

<my-tag1>
  <my-tag2 attr1="a" store={opts.store}>
    <my-tag3 attr2="b"></my-tag3>
  </my-tag2>
</my-tag1>

Зачем? Я должен сделать это во всех моих тегах?

Answer 1

riot.mount('*') монтирует все теги верхнего уровня. Теги верхнего уровня позаботятся о монтировании своих вложенных тегов соответственно. Если вы хотите пройти мимо магазина, я думаю, что лучше всего использовать миксины. Смотрите http://riotjs.com/guide/

Ура!

Answer 2

Когда теги вложены, для дочернего тега создается новый контекст. В новом контексте все наследуемые свойства родителя устанавливаются в undefined,

Рекомендации:

• https://github.com/riot/riot/issues/1720
• http://riotjs.com/guide/

В вашем примере, добавив store={opts.store} в my-tag2вы определяете опцию store в my-tag2Новый контекст. Если вы этого не сделаете, вариант store в my-tag2контекст унаследован отmy-tag1, но он установлен в undefined (так my-tag2 видит undefined для storeценность).

Для того, чтобы поделиться storeценность через my-tag1, my-tag2, а также my-tag3Есть два способа, на мой взгляд:

1) my-tag3 инициализирует storeценность для my-tag2"s store

<my-tag1>
  <my-tag2 attr1="a" store={opts.store}>
    <my-tag3 attr2="b" store={opts.store}></my-tag3>
  </my-tag2>
</my-tag1>

2) my-tag3 инициализирует storeценность для my-tag1"s store с использованием parent переменная.

<my-tag1>
  <my-tag2 attr1="a" store={opts.store}>
    <my-tag3 attr2="b" store={parent.opts.store}></my-tag3>
  </my-tag2>
</my-tag1>