在 vue.js 组件中响应 this.props.children

Reacts this.props.children in vue.js component

React 有类似 this.props.children 的东西:https://facebook.github.io/react/tips/children-props-type.html

Vue.js是否也有一些类似的访问子元素?

Vue.js 有 this.$children,这也给你一个子组件数组

http://vuejs.org/api/#vm-children

如果要引用特定组件,您可能需要使用 v-refthis.$refs

在您的要求中:

当您处于父组件级别时,使用插槽是将自定义组件传递到子组件的正确方法。

但为什么不起作用?因为在Vue 1.0中,是使用浏览器来解析模板,而不是virtualDOM。浏览器解析有问题:一些 HTML 元素对可以出现在其中的元素有限制。

查看 Vue1.0 文档:vue1.0 - components - template parsing

而你恰好犯了那个错误。

这是Vue1.0的一个限制,你必须写一些指令来做。

但是在 Vue 2.0 中,情况发生了变化,模板解析变成了虚拟 dom 实现。您可以将任何 DOM 元素传递到插槽中。

我在 Vue 2.0 的最后评论中尝试了你的 link,它有效。

只需将外部资源更改为 https://unpkg.com/vue@2.0.1/dist/vue.js

在Vue中相当于this.props.children<slot />.

例子

<template>
  <div>
    <slot />
  </div>
</template>

http://vuejs.org/guide/components.html#Content-Distribution-with-Slots