<body> <div id="app">
<p>总数：{{total}}</p>
<my-component v-model="total">
</my-component>
<button @click="handleGetTotal"></button>
</div></body>
<script src="https://unpkg.com/vue/dist/vue.min.js"></script><script>
Vue.component('my-component',{
prors:['value'],
template:'<input :value="value" @input="handleIncrease"/>',
methods:{
handleIncrease:function(event){
this.$emit('input',event.target.value);
},
}
}); var app=new Vue({
el:'#app',
data:{
total:0
},
methods:{
handleGetTotal:function(){ this.total--;
}
}
})</script>中间template:'<input :value="value" @input="handleIncrease"/>',这句话什么意思，这个value怎么来的，浏览器报错也说value未定义
1 回答
叮当猫咪
TA贡献1776条经验 获得超12个赞
<input :value="value" @input="handleIncrease"/>
:value 意思是 把props里的value绑定 其实跟我们平时的
<input v-model="value" @input="handleIncrease"/>一样
至于@input="handleIncrease" 是当input的值发生改变时，handleIncrease里的this.$emit('input')是改变props的值，使得有双向绑定的效果
添加回答
举报
0/150
提交
取消