老师,我感觉watch没啥用,顺便检查下代码,谢谢
来源:3-23 自由编程
twtszz
2020-08-13 23:54:40
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id='div'>
<input type="text" v-model.number="value1">
<select v-model="value" @click="resultFn">
<option value="add">+</option>
<option value="sub">-</option>
<option value="mul">*</option>
<option value="divi">/</option>
</select>
<input type="text" v-model.number="value2"/>
<button @click='resultFn(value1,value2)'>=</button>
<input type="text" v-model="result">
</div>
<script>
var vm = new Vue({
el:'#div',
data:{
value1:'',
value2:'',
result:'',
value:'add'
},
methods:{
resultFn:function(num1,num2){
switch(this.value){
case 'add': this.result = this.value1 + this.value2;break;
case 'sub': this.result = this.value1 - this.value2;break;
case 'mul': this.result = this.value1 * this.value2;break;
case 'divi': this.result = this.value1 / this.value2;break;
}
},
watch:{
value:function(){
this.resultFn();
}
}
}
})
</script>
</body>
</html>
1回答
好帮手慕久久
2020-08-14
同学你好,代码中有如下问题:
watch方法,是vue自带的方法,不能写在methods中(写在methods中会无效),如下:

修改后,select上的方法就可以不用写了:

如果我的回答帮到了你,欢迎采纳,祝学习愉快!
相似问题