<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title></title>
</head>
<body>
<div id="app">
<div>
数值A：<input type="" name="" id="" v-model="a" />
</div>
<div>
数值B：<input type="" name="" id="" v-model="b" />
</div>
<button type="button" @click="add">计算</button><br>
<span>计算结果：</span>
<span>{{this.c}}</span>
</div>
<!-- 引入vue.js文件 -->
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
new Vue({
el:'#app',
data() {
return {
a:'',
b:'',
c:''
}
},
methods:{
add() {
this.c = Number(this.a) + Number(this.b)
}
}
})
</script>
</body>
</html>
Vue实现简单加法计算
免责声明！
本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系本站邮箱yoyou2525@163.com删除。