Vue実現簡易計算機
本論文の実例では、Vue実現簡易計算機の具体的なコードを共有します。参考にしてください。具体的な内容は以下の通りです。
以上が本文の全部です。皆さんの勉強に役に立つように、私たちを応援してください。
<html>
<body>
<div id="demo">
<h2> </h2>
<p> ：<input type="text" v-model="firNum"></p>
<p> ：<input type="text" v-model="secNum"></p>
<p>
<button @click="plus">+</button>
<button @click="dec">-</button>
<button @click="multiple">x</button>
<button @click="devise">/</button>
</p>
<p> ：<span v-text="result"></span></p>
</div>
<script>
var v = new Vue({
el:"#demo",
data:{
firNum:"",
secNum:"",
result:""
},
methods:{
plus:function () {
// this.result = this.firNum + this.second; //
this.result = parseInt(this.firNum) + parseInt(this.secNum);
},
dec:function () {
this.result = parseInt(this.firNum) - parseInt(this.secNum);
},
multiple:function () {
this.result = parseInt(this.firNum) * parseInt(this.secNum);
},
devise:function () {
this.result = parseInt(this.firNum) / parseInt(this.secNum);
}
}
})
</script>
</body>
</html>以上が本文の全部です。皆さんの勉強に役に立つように、私たちを応援してください。