v-model相当于是value属性和input事件的语法糖,可以将一些模块封装成组件:比如说input这样有利于使用。
在父组件中的代码:
<two v-model="value"></two>
<div>{{ value }}</div>
import two from './two'//input组件
在子组件中:
<template>
<div>
<input type="text" :value=" value " @input="dian" >
</div>
</template>
<script>
export default {
name:"two",
props:{
value:{
type:String,
default:"moren"
}
},
methods: {
dian(e){
this.$emit("input",e.target.value)
}
},
}
</script>
<style lang="scss">
</style>
当然value和input不能随便改变