<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>简易计算器</title> <script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script> </head> <body> <div id="app"> <input type="text" v-model="n1"> <select v-model="opt"> <option value="+">+</option> <option value="-">-</option> <option value="*">*</option> <option value="/">/</option> </select> <input type="text" v-model="n2"> <input type="button" @click="calc1" value="="> <input type="text" v-model="result"> </div> <script> var vm = new Vue({ el: '#app', data: { n1:0, n2:0, opt: '+', result: 0, }, methods:{ calc(){ switch(this.opt){ case '+': this.result = parseInt(this.n1) + parseInt(this.n2);break; case '-': this.result = parseInt(this.n1) - parseInt(this.n2);break; case '*': this.result = parseInt(this.n1) * parseInt(this.n2);break; case '/': this.result = parseInt(this.n1) / parseInt(this.n2);break; } }, calc1(){ var codeStr = 'parseInt(this.n1) ' + this.opt + 'parseInt(this.n2)'; this.result =eval(codeStr); } } }) </script> </body> </html>