求问我该如何使用v-model组件？

Question

v-model在组件中的使用我感觉就是一个传值的过程，vue在传值过程中方式也还是比较多的，像是event或者props等，但是不太熟悉v-model在组件中应该如何使用。

Answer 1

v-model在组件中如何使用。
实现点击回应后，父亲对儿子说的话变成了儿子的回应。儿子收到的信息也变了，实现通信。

<!-- 父组件 --> <template> <p class="parent"> <p>我是父亲, 对儿子说： {{sthGiveChild}}</p> <Child v-model="sthGiveChild"></Child> </p> </template> <script> import Child from './Child.vue'; export default { data() { return { sthGiveChild: '给你100块' }; }, components: { Child } } </script>

<!-- 子组件 --> <template> <p class="child"> <p>我是儿子，父亲对我说： {{give}}</p> <a href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" @click="returnBackFn">回应</a> </p> </template> <script> export default { props: { give: String }, model: { prop: 'give', event: 'returnBack' }, methods: { returnBackFn() { this.$emit('returnBack', '还你200块'); } } } </script>

默认情况下，一个组件上的 v-model 会把 value 用作 prop 且把 input 用作 event。