子组件在computed中传值给父组件

子组件在computed中传值给父组件

通常子组件传值给父组件都是通过methods，然后父组件再拿。通过computed就能直接更新父组件的值。

export default { // 子组件
	props: {
		selected: {
			type: number,
			required: true
		}
	}，
	computed: {
		syncSelected: {
      		set (value) { // 把子组件改变后的值提交给父组件
        		this.$emit('update: selected', value)
      		},
      		get () { // 获取父组件的值
        		// console.log(this.selected)
        		return this.selected
      		}
    	}
	}
}

<template>
	<div>
		<LayoutProperties :selected.sync = "selected"></LayoutProperties >
	</div>
<template>
<script>
import LayoutProperties from './layout-properties'
export default {
  data () {
    return {
      selected: 0
    }
  }
	

父组件通过 :value.sync = "value"获取子组件的值，此时Vue.sync修饰符可不能少！！

摘自