vue .sync修饰符 - 个人笔记

如果想在子组件中修改父组件的props属性，一般这么做：

子组件：

props:{
	title:{
		type: String
	}
},
methods:{
	changeTitle(){
		// 当子组件想应用父组件的时候
		this.$emit('update:title', '新标题')
	}
}

父组件：

<document :title="title" @update-title="title = $event">
</document>

如果用上.sync可以这么写：

<document :title.sync="title">
</document>

如果想在子组件中修改父组件多个props属性，一般这么做：

<document
	:title="doc.title"
	:content="doc.content"
	@update:title="doc.title = $event"
	@update:content="doc.content = $event"
>
</document>

如果用上.sync修饰符：

<document v-bind.sync="doc">
</document>

参考链接：
https://cn.vuejs.org/v2/guide/components-custom-events.html#sync-%E4%BF%AE%E9%A5%B0%E7%AC%A6