vue子组件数据变化同步到父组件中

方法:通过watch监听子组件数据变化

1.父组件中注册方法

<Child @getChildValue="getChildValue"></Child>

2.子组件中通过watch监听数据变化,数据变化时通过$emit来触发方法传参

<template>
    <div class="child">
        <p>子组件同步数据到父组件</p>
        <input type="text" v-model="childValue">
    </div>
</template>
<script>
export default {
    data(){
        return{
            childValue:''
        }
    },
    watch: {
        childValue(val){
            this.$emit("getChildValue",{value:this.childValue})
        }
    },
}
</script>

猜你喜欢

转载自www.cnblogs.com/mmzuo-798/p/11607079.html