.sync
.sync可以实现子组件同步修改父组件的值
1.父组件通过 属性.sync可以对子组件进行传值操作 2.子组件通过props可以对父组件的值进行接收 3.子组件可以通过 this.$emit 对父组件的值进行 update:属性
父组件
<template>
<div class="app">
{{arrList}}
<hr>
<Child :money.sync="arrList"/>
// <Child :money="arrList" v-on:update:money="arrList= $event"/> //两句作用等同
</div>
</template>
<script>
import Child from "./Child.vue";
export default {
data() {
return { arrList: 10000 };
},
components: { Child }
};
</script>
子组件
<template>
<div class="child">
{{money}}
<button @click="$emit('update:money', money-100)">
</button>
</div>
</template>
<script>
export default {
props: ["money"]
};
</script>