Тег RiotJS внутри yield не обновляется

Question

У меня проблема при использовании yield и обновлении тега, см. Пример http://codepen.io/Pysta/pen/pEyoBY

<script type="riot/tag">
  <maintag>

    <yieldtag name='yield_tag'>
      <select>
        <option each={ items }>{ value }</option>
      </select>

    </yieldtag>


    var self = this;
    self.items = [
        {value:1},
        {value:2},
            {value:3},
        {value:4}
    ];
        self.items = [];

    this.on('mount', function () {
        var oReq = new XMLHttpRequest();
      oReq.addEventListener("load", reqListener);
      oReq.open("GET", "/api/category/0");
      oReq.send();
    });

    function reqListener(e) {
        console.log('load');
        self.items = [
        {value:1},
        {value:2},
            {value:3},
        {value:4}
      ];
        self.update(); 
    }

  </maintag>
</script>


<script type="riot/tag">
  <yieldtag>
    <yield />
  </yieldtag>
</script>

<maintag></maintag>

Если я загружаю данные сразу (строка комментария с "self.items = [];"), это работает так, как и должно, но когда я делаю запрос и обновляю его асинхронно, ничего не меняется.

Если я удаляю yieldtag изнутри maintag, он работает.

Любая помощь / предложения приветствуются.

Answer 1

Если вы измените each={ items } в each={ parent.items } это будет работать как положено

Путаница с <yield /> является то, что вы пишете свой шаблон логики в <maintag>, но как только компоненты смонтированы, ваш код на самом деле работает в <yieldtag>, items массив существует в контексте <maintag>, который <yieldtag>Родитель после монтажа.

Подробнее о вложенных тегах см. Документацию Riot.