关于前端:vue-修饰符sync深入解析

实现子组件与父组件双向绑定的【sync】修饰符：其实sync这个修饰符是vue1.0就有的，它能够实现父子组件的双向绑定，然而Vue2.0被移除了，直到2.3.0版本公布后，又从新开始启用，【.sync】能够很轻松的实现子组件同步批改父组件的值

如果子组件想批改父组件的值，举荐以update:my-prop-name 的模式触发事件取而代之，也就是这样：

父组件
<text-document
  v-bind:title="doc.title"
  v-on:update:title="doc.title = $event"
></text-document>
---------------------------------------------------------------
子组件
this.$emit("update:title".newTitle)

而上边的 v-on:update:title=”doc.title = $event”，实质上就能够用sync这个语法糖来示意，.sync前面紧接的就是父组件中须要被扭转的值，看下边的例子领会一下

父组件
<template>
    <div>
        <child-com :value.sync="text" ></child-com>
    </div>
</template>
<script>
    export default{
        data(){
            return {
                text:"父组件的值",
            }
        },
    }
</script>
==================================================================================
//子组件中批改父组件的值
<template>
    <div @click="post"></div>
</template>
 
<script>
    export default{
        methods:{
            post(){
                this.$emit('update:value',"子组件的值")
            }
        }
    }