往往组件拆分需要负责数据的传递,通常会通过自定义事件来数据交互,但是如果使用v-module
来做数据的交互,这样也许会简单很多。
子组件UserInfo.vue
<template>
<div>
<input
type="text"
:value="value"
@input="value=$event.target.value">
</div>
</template>
<script>
export default {
props: {
value: {
type: String,
default: ''
}
}
}
</script>
父组件引用子组件
<user-info v-model="msg"></user-info>
一个组件上的 v-model
默认会利用名为 value
的 prop
和名为 input
的事件。参考链接
这样写简单很多了,比起子组件$emit
父组件自定义事件的形式
网友评论