vue 父子组件传值 双向绑定

父组件：

<template>
//:content , @content  中的：@一个是v-bind 一个是v-on的写法。
//:content="detail" 中 :content 对应子组件中props: ['content']的content,可随意替换。
//@content="saveDetail" 的content 对应子组件中 this.$emit('content', val)的content。
//saveDetail 触发方法将值存入父组件
<editor :content="detail" @content="saveDetail"></editor>
</template>
<script>
//引入子组件
 import editor from "../../../components/ueditor/editor";
 export default {
 //引入子组件
        components: {
            editor,
        },
        //定义变量
         data() {
            return {
                    detail: '',
                },
		},
		 methods: {
		 	//子组件值传回的值 放入 detail中
            saveDetail(val){
                this.detail = val
            },	
	}
	</script>
	

子组件：

<template>
<el-input v-model="detail"></el-input>
</template>
<script>
    export default {
    //获取父组件传递过来的值
        props: ['content'],
        computed: {
            detail: {
            	//自动放入detail中
                get() {
                    return this.content
                },
                //子组件传回父组件
                set(val) {
                    this.$emit('content', val)
                }
            }
        },
	}
<script>