每个组件的实例都有它自己的独立作用域。数据可以通过 props 向下传递给它的子组件 .. 一个 prop 就是一个自定义的属性，它可以在父组件上面传递信息 ... 子组件需要使用一个 props 选项，去声明一下它需要用的 props ...

比如我的这个 ui-button 组件，在它里面添加一个 props 选项 .. 声明一下它期望使用的属性 .. 一个数组 .. 里面添加一个 text ...

我们可以把这个 text 属性用作按钮上要显示的文字 ... {{ text }} ..

然后在使用这个组件的地方法，可以给它添加一个 text 属性，它的值可以传递到组件的里面 .. 再给其它的两个按钮也添加一个 text 属性 .. 然后设置一下对应的值 ...

你会看到，现在按钮上就会显示自定义的文字 .. 这些数据是通过 text 属性传递给它们的 .. 在 Vue 开发工具的上面，选中一个 UiButton 组件 .. 在右边这里会显示使用的 prop ，还有对应的值 ..

我们也可以在组件的上面动态的绑定一些数据 .. 可以使用 v-bind .. 简写形式就是一个冒号，后面加上绑定的属性的名字，这里就是 text，给它绑定一个 published ，我们可以根据这个数据的值动态的显示按钮上的文字，如果这个值是 true 的话，就显示一个 unpublish ，如果是 false ，就显示一个 publish ... 然后在应用里添加一个 published 数据 .. 先把它的值设置成 false ..

现在这个按钮上显示的文字是 publish，因为给它的 text 属性绑定的数据 published 的值，现在是 false ... 再去设置一下这个数据值 ... 让它等于 true ... 这样按钮上的文字就会变成 unpublish ...

再把它设置成 false ... 按钮上的文字又会变成 publish ...