如何访问 riot.js 中的子元素

如果我有一个习惯riot带有一个标签p像这样：

<custom>
  <p>This is a text</p>
</custom>

我如何访问<p>元素从内部<custom> tag?

Update:我收到了一大堆关于从 DOM 中选择它的方法的答案。我想要的是一种选择内在的方法p来自组件库内的标签riot.js https://github.com/muut/riotjs本身。我正在寻找更 riotjs 具体的答案。例如与polymer https://github.com/polymer/polymer你用this.$.content.getDistributedNodes().

Riot 仅提供 4 个属性来访问您所在当前标签的数据：

• 这个.opts
• this.parent
• 这个.root
• 这个标签

请参阅 API 文档 https://muut.com/riotjs/api/#tag-instance

edit

除此之外你还可以直接访问named elements:

<my-tag>
  <p name="foo">Hi, I'm foo</p>
  <script>
    console.log(this.foo);
  </script>
</my-tag>

请参阅文档 https://muut.com/riotjs/guide/#named-elements

/edit

There's no direct reference to any of the elements you defined in your custom-tag; the rest comes down to just pure old JS (which you might favour or not).

正如其他人所说，您可以使用 dom 方法访问元素。然而，在某些情况下，您需要等待 DOM 实际加载。例如：

<my-tag>
  <p>yada</p>
  <script>
    console.log(this.root.querySelector('p'))
  </script>
</my-tag>

不起作用，因为 DOM 还没有准备好。相反，将选择器包装在“mount”事件侦听器中，如下所示：

<my-tag>
  <p>yada</p>
  <script>
    this.on('mount', function() {
      console.log(this.root.querySelector('p'))
    })
  </script>
</my-tag>