Vue通过prop进行双向数据绑定。子组件数据变动，个别只能通过 this.$emit(func, val) 回调父组件函数来传值给父组件。
Vue2.3版本引入sync，作为一个事件绑定语法糖，当子组件触发事件时，父组件会响应事件并实现数据更新： 官网
1. 应用Vue.sync和this.$emit('update:title', newTitle)
父组件代码：
data() { return { val: '' }},<child :childValue.sync="val"></child><div>{{val}}</div>子组件代码：
props: { childValue: { type: String, default: '' },},data() { return { val: '' }},methods: { checkVal() { this.$emit('update:childValue', this.val) },}<input type="text" v-model="val" @input="checkVal">下面的办法就是能够在子组件更改父组件的值了，除此之外，还能够应用$emit(fun, val)办法和$parent:
2. 应用$emit(fun, val)
父组件代码：
data() { return { val: '' } }, methods: { checkVal(val) { this.val = val }, }<child @checkVal="checkVal"></child><div>{{val}}</div>子组件代码：
props: {},data() { return { val: '' }},methods: { checkVal() { this.$emit('checkVal', this.val) },}<input type="text" v-model="val" @input="checkVal">3. 应用$parent
父组件代码：
data() { return { val: '' } }, methods: { checkVal(val) { this.val = val }, }<child></child><div>{{val}}</div>子组件代码：
props: {},data() { return { val: '' }},methods: { checkVal() { // 通过 $parent层叠能够一层一层地往上追溯各级父组件，比方this.$parent.$patent.checkVal() this.$parent.checkVal(this.val) },}<input type="text" v-model="val" @input="checkVal">