02编译作用域

编译作用域

在深入内容分发API之前，我们先明确内容的编译作用域。假定模板为：

<child-component> {{ message }} </child-component>

message 应该绑定到父组件的数据，还是绑定到子组件的数据？ 答案是父组件。组件作用域简单地说是：

父组件模板的内容在父组件作用域内编译；子组件模板的内容在子组件作用域内编译。 一个常见错误是试图在父组件模板内将一个指令绑定到子组件的属性/方法：

<child-component v-show="someChildProperty"></child-component>

假定 someChildProperty 是子组件的属性，上例不会如预期那样工作。父组件模板不应该知道子组件的状态。

如果要绑定子组件内的指令到一个组件的根节点，应当在它的模板内这么做：

Vue.component('child-component', { // 有效，因为是在正确的作用域内 template: '<div v-show="someChildProperty">Child</div>', data: function() { return { someChildProperty: true } } })