在Vue中如果子组件想修改数据并且同步到父组件的办法！

如果子组件想修改数据并且同步更新到父组件，在一些情况下，我们可以使用.sync来做：如图父组件子组件：这里我们需要注意的是：1.sync不能和表达式一起使用如：v-bind:title.sync="doc.title + '!'"是无效的2.sync不能用在字面量对象上：v-bind.sync="{ title: doc.title }"是无法正常工作的3....

weixin_38809190

2997人浏览 · 2019-06-05 16:30:19

weixin_38809190 · 2019-06-05 16:30:19 发布

如果子组件想修改数据并且同步更新到父组件，在一些情况下，我们可以使用.sync来做：

如图父组件

父组件

子组件：

这里我们需要注意的是：

1.sync不能和表达式一起使用如：v-bind:title.sync="doc.title + '!'"是无效的

2.sync不能用在字面量对象上： v-bind.sync="{ title: doc.title }"是无法正常工作的

3.对于一个数组或者对象来说，我们不需要使用sync，在子组件中改变这个数组和对象将会自动影响到父组件的状态。比如上图的arr数组状态。

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^