javascript - 如何使用 riot js 将变量传递给子标签

Question

我在 riot js 方面经验不多。我创建的标签层次结构如下

<tag-1>
    <tag-2>
        <tag-3>
        </tag-3>
    </tag-2>
</tag-1>

现在我需要将变量(whcih 包含 JSON)传递给“tag-3”，并且在每次更新该变量时我如何更新“tag-3”。现在我正在安装像

这样的“tag-3”

riot.mount('tag-3', { comm: "Hello" });

其中“comm”是变量，在标记“tag-3”中无法访问变量“comm”后，它显示为未定义。另一件事，每个标签 html 都在一个单独的“.tag”中，并且使用该标签我正在调用其他标签，例如在“tag-1.tag”文件中调用“tag-2”并在“tag-2.tag”中文件我称之为“tag-3”，在“tag-2.tag”文件中我正在安装“tag-3”

我该怎么做？

Answer 1

1. 您不需要在其他 riot 标签内安装标签 - 只需要安装根标签。这就是您的 comm 参数没有进入 tag-3 的原因。

2. 您可以在一个 .tag 文件中有多个标签定义。 tag文件编译完成后，里面的riot tags是否从多个tag文件中加载都没有关系。

3. 您可以将变量作为标记属性传递 - 它们将在 opts 变量下可用。

将所有内容放在一起，您的单个标记文件可能如下所示:

<tag-1>
  <p>This is my TAG1</p>
  <tag-2 comm="{ commValue}"></tag-2>

  <script>
    this.commValue = { text: 'My text' }
  </script>
</tag-1>

<tag-2>
  <p>This is my TAG2 with comm: { opts.comm.text }</p>

  <script>
    this.on('update', function () {
      // you can use 'opts.comm' here
    });

  </script>
</tag-2>