摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Vuejs作业</title> </head> <body> <div id = "box&quo
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Vuejs作业</title>
</head>
<body>
<div id = "box">
<h2>加减运算</h2>
<input type="text" v-model="number1"> + <input type="text" v-model = "number2"> =<span>{{message}}</span>
</div>
<script src ="js/vue.js"></script>
<script>
new Vue({
el:'#box',
data:{
number1:0,
number2:0,
message:0
},
watch:{
number1:function(e){
if(isNaN(e))
{
this.message='请输入合法数值';
}else{
this.message=parseFloat(this.number1)+parseFloat(this.number2);
}
},
number2:function(e){
if(isNaN(e))
{
this.message='请输入合法数值';
}else{
this.message=parseFloat(this.number1)+parseFloat(this.number2);
}
}
}
})
</script>
</body>
</html>
批改老师：韦小宝批改时间：2019-03-04 09:14:07
老师总结：使用了侦听器带来了很大的方便 可能需要使用jQuery写几行代码的量 在这里轻轻松松就搞定了
