一個簡單的加法運算
<!DOCTYPE html> <html> <head id="head"> <title>{{title}}</title> </head> <body> <div id="app"> <p>最終加法結果:{{sumNum}}</p> <input type="text" v-model="firstNum">+<input type="text" v-model="secondNum"><br /> <button v-on:click="calSum">點擊求和</button> </div> <script src="https://unpkg.com/vue/dist/vue.min.js"> </script> <script> var head=new Vue({ el:'#head', data:{ title:'加法測試' } }) var app = new Vue({ el:'#app', data:{ sumNum: 0, firstNum: 0, secondNum:0 }, methods: { calSum: function () { var sum = Number(this.firstNum) + Number(this.secondNum) this.sumNum = sum }
} }) </script> </body> </html>