<div> 父组件： <input v-model="val"><br/> 子组件： <test :test.sync="val"></test> </div> <script> var vm = new Vue({ el: '#app', data: { val: 1 }, components: { "test": { props: ['test'], template: "<input v-model='test'/>" } } }); </script>
效果是无论你改哪一个的值，另外一个都会随之变动。
【4】props验证：
简单来说，当组件获取数据时，进行验证，只有符合条件的时候，才会使用之。
写法是将props变为一个对象，被验证是值是对象的key，验证条件是和key对应的value。
例如：
props: { test: { twoWay: true } },
验证test这个变量是不是双向绑定，如果不是，则报错。（注意，这个不能用于验证单向绑定）。
示例代码如下：
<div> 父组件： <input v-model="val"><br/> 子组件： <test :test="val"></test> </div> <script> var vm = new Vue({ el: '#app', data: { val: 1 }, components:{ test:{ props: { test: { twoWay: true } }, template: "<input v-model='test'/>" } } }); </script>
更多验证类型请查看官方教程：
以上所述是小编给大家介绍的Vuejs第九篇之组件作用域及props数据传递实例详解，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
您可能感兴趣的文章: