摘要：
<!-- 包含该 prop 没有值的情况在内，都意味着 `true`。--> <blog-post is-published></blog-post> <!-- 即便 `false` 是静态的，我们仍然需要 `v-bind` 来告诉 Vue --> <!-- 这是一个 JavaScript 表达式而 阅读全文
摘要：
<!-- 即便 `42` 是静态的，我们仍然需要 `v-bind` 来告诉 Vue --> <!-- 这是一个 JavaScript 表达式而不是一个字符串。--> <blog-post v-bind:likes="42"></blog-post> ```html <!DOCTYPE html> < 阅读全文
摘要：
到这里，我们只看到了以字符串数组形式列出的 prop： props: ['title', 'likes', 'isPublished', 'commentIds', 'author'] 但是，通常你希望每个 prop 都有指定的值类型。这时，你可以以对象形式列出 prop，这些 property 的 阅读全文
摘要：
HTML 中的 attribute 名是大小写不敏感的，所以浏览器会把所有大写字符解释为小写字符。这意味着当你使用 DOM 中的模板时，camelCase (驼峰命名法) 的 prop 名需要使用其等价的 kebab-case (短横线分隔命名) 命名： Vue.component('blog-po 阅读全文
摘要：
组件名 全局注册 局部注册 模块系统 阅读全文
摘要：
如果你没有通过 import/require 使用一个模块系统，也许可以暂且跳过这个章节。如果你使用了，那么我们会为你提供一些特殊的使用说明和注意事项。 在模块系统中局部注册 如果你还在阅读，说明你使用了诸如 Babel 和 webpack 的模块系统。在这些情况下，我们推荐创建一个 compone 阅读全文
摘要：
全局注册往往是不够理想的。比如，如果你使用一个像 webpack 这样的构建系统，全局注册所有的组件意味着即便你已经不再使用一个组件了，它仍然会被包含在你最终的构建结果中。这造成了用户下载的 JavaScript 的无谓的增加。 在这些情况下，你可以通过一个普通的 JavaScript 对象来定义组 阅读全文
摘要：
到目前为止，我们只用过 Vue.component 来创建组件： Vue.component('my-component-name', { // ... 选项 ... }) 这些组件是全局注册的。也就是说它们在注册之后可以用在任何新创建的 Vue 根实例 (new Vue) 的模板中。比如： Vue 阅读全文
摘要：
在注册一个组件的时候，我们始终需要给它一个名字。比如在全局注册的时候我们已经看到了： Vue.component('my-component-name', { /* ... */ }) Vue.component('hzh-component-name', {}); Vue.component('h 阅读全文
摘要：
基本示例 组件的复用 组件的组织 通过 Prop 向子组件传递数据 单个根元素 监听子组件事件 通过插槽分发内容 动态组件 解析 DOM 模板时的注意事项 阅读全文
摘要：
有些 HTML 元素，诸如 <ul>、<ol>、<table> 和 <select>，对于哪些元素可以出现在其内部是有严格限制的。而有些元素，诸如 <li>、<tr> 和 <option>，只能出现在其它某些特定的元素内部。 这会导致我们使用这些有约束条件的元素时遇到一些问题。例如： <table> 阅读全文
摘要：
有的时候，在不同组件之间进行动态切换是非常有用的，比如在一个多标签的界面里： 上述内容可以通过 Vue 的 <component> 元素加一个特殊的 is attribute 来实现： <!-- 组件会在 `currentTabComponent` 改变时改变 --> <component v-bi 阅读全文
摘要：
和 HTML 元素一样，我们经常需要向一个组件传递内容，像这样： <alert-box> Something bad happened. </alert-box> 可能会渲染出这样的东西： 幸好，Vue 自定义的 <slot> 元素让这变得非常简单： Vue.component('alert-box 阅读全文
摘要：
在我们开发 <blog-post> 组件时，它的一些功能可能要求我们和父级组件进行沟通。例如我们可能会引入一个辅助功能来放大博文的字号，同时让页面的其它部分保持默认的字号。 在其父组件中，我们可以通过添加一个 postFontSize 数据 property 来支持这个功能： new Vue({ e 阅读全文