Question

我尝试使用加载标记的概念我可以在检索数据异步时包装其他元素以提供一致的加载显示。请考虑以下代码：

此示例依赖于browserify（require），但不应该有所作为问题

<test>
    <loading>
        <ul>
            1. = <li each={ items }>{ title }</li>
            or
            2. = <li each={ parent.items }>{ title }</li>
            or
            3. = <li each={ opt.data.items }>{ title }</li>
        </ul>
    </loading>

    <script>
        require('riot');
        require('./loading.tag');

        this.items = [
            { title: 'title 1'},
            { title: 'title 2'}
        ];

        this.on('mount', function () {
            riot.mount('loading', /* for 3 = */ {data: this.items});
        })
    </script>
</test>

如您所见，标记为<test />并包含嵌套标记<loading />，其中包含内容<test />显示。问题是我不确定引用items数组的正确方法（在现实世界中通过ajax引入）。我尝试过选项1＆amp; 2但没有任何显示。 3个工作（将数据作为选项传递）但感觉不对。

这可能与<yield />有关，这是<loading />显示其内容的方式，但我不知道为什么。

<loading>
    <div><yield /></div>
</loading>

Answer 1

当我尝试上面的代码时，2得到了正确的结果。我的上述代码存在一些可能导致问题的问题。

1）我从未在标签内部使用过需求。我怀疑它在需要标签文件时有效。 .tag扩展名没有任何作用。发出脚本标签的type="riot/tag"不是javascript，而是一个可以被暴乱使用的特殊脚本。

~~2）您已关闭代码</about>而非</test>。我认为你的防暴标签在这种情况下不会编译。~~

3）我不知道你正在使用什么版本的暴乱，但是在2.3.12如果你安装了测试标签，那么任何孩子（在这种情况下你的“负载”）都将自动挂载，只要你已经加载.tag文件。我认为问题是你在“加载”标签上调用两次mount，这可能会将它们与父母分开。

我认为您的问题是<loading>标记在安装<test>时没有任何意义。然后，您需要loading.tag，然后允许加载加载。在安装测试之前尝试要求<loading>。我做了一个js小提琴，我会怎么做。希望这能回答你的问题。

https://jsfiddle.net/cm09mtc5/

如何正确引用＆＃39;嵌套＆＃39;在riotjs

1 个答案: