【学习记录】vue中.sync用法

作用：父组件给子组件传值时，子组件可以同步修改父组件中的数据
使用方法：
父组件中的子组件：

 <!--父组件中调用子组件时需要@updateData="这里是父组件的实际的方法",在方法里获取子组件传来的参数-->
<!--rowsParent是父组件的数据，rows是子组件的props中的-->
<ActivityShowDialog :rows.sync="rowsParent" @updateData="updateData"></ActivityShowDialog>

子组件

 export default {
        name:'ActivityShowDialog',
        props:{
            rows:{
                type: Array,
                default: () => []
            }
        },
        methods:{
        //在方法里使用this.$emit告诉父组件传过来的rows改变了，需要加上 update:
           cancel(){
	           this.$emit('update:rows',[])
	           this.$emit('updateData',"111") //定义传给父组件的方法参数
           }
        }

xxx.sync可以扩展成

<ActivityShowDialog :rows="rowsParent" @update:rows="val => rowsParent = val"></ActivityShowDialog >

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

this.$emit('update:rows', newValue)