vue实现网页简单计算器实例代码

DOCTYPE html>
html>
    head>
        meta charset="UTF-8">
        title>title>
        script type="text/javascript" src="js/vue.js" >script>
    head>
    body>
        div id="app">
            input type="text" v-model="num1" />
            select v-model="opt">
                option value="+">+option>
                option value="-">-option>
                option value="*">*option>
                option value="/">/option>
            select>
            input type="text" v-model="num2"  />
            button @click="getResult" >=button>
            input type="text" v-model="res" />
            
        div>
        script type="text/javascript">
            var vm = new Vue({
                el:"#app",
                data:{
                    num1:0,
                    num2:0,
                    opt:‘+‘,
                    res:0
                },
                methods:{
                    getResult(){
                        console.log(this.opt)
                        var str = ‘Number(this.num1)‘+this.opt+‘Number(this.num2)‘
//                        eval函数是把参数当做能执行的代码来执行
                        this.res = eval(str)
                    }
                }
            })
        script>
    body>
html>