vue中sync修饰符

从2.3.0起，Vue重新引入了 .sync修饰符，但是这次它只是作为一个编译时的语法糖存在。它会被扩展为一个自动更新父组件属性的 v-on 监听器。

示例一：
父组件：

等同

子组件：

 watch: {
      items(val) {
        this.tableData = val
      },
      tableData(val) {
        this.$emit('update:items', val)
      }
    },
    computed: {
    },
    data() {
      return {
        tableData: []
      }
   }

示例二：
父组件：

data() {
      return {
        form: {
          valid_phone: false // 是否有字段不正确
        }
      };
    }

子组件：
触发事件，传递更新的值

 this.$emit('update:valid', false);

如下：

会被扩展为：

bar = val”>

当子组件需要更新foo的值时，它需要显示地触发一个更新事件：

this.$emit(“update:foo”, newValue)

Vue修饰符sync的功能是：当一个子组件改变了一个prop值时，这个变化也会同步到父组件中所绑定。如果我们不用 .sync，我们也可以用props传初始值，然后事件监听。