06.简易计算器

最新推荐文章于 2024-03-18 12:04:12 发布

吃了可爱多的我

最新推荐文章于 2024-03-18 12:04:12 发布

阅读量72

点赞数

分类专栏： vue 文章标签： vue

本文链接：https://blog.csdn.net/a123456789qqo/article/details/113801791

版权

vue 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

注:要先在该文件的同路径下导入vue.js

<!DOCTYPE html>
<html>
<head>
<title>Document</title>
<script src="vue.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" value="=" @click="calc()">
    <input type="text" v-model="result">
  </div>
<script>
var vm = new Vue({
el:'#app',
data: {
    n1:0,
    n2:0,
    result:0,
    opt:'+',
},

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;
        // default:
        //     break;
        // },

        //注意：这是投机取巧方式，尽量少用
    var codeStr='parseInt(this.n1)' +this.opt+ 'parseInt(this.n2)' 
    this.result=eval(codeStr)
    }

    },

   
    

})
</script>
</body>
</html>

吃了可爱多的我

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
06.简易计算器

注:要先在该文件的同路径下导入vue.js<!DOCTYPE html><html><head><title>Document</title><script src="vue.js"></script></head><body> <div id="app"> <input type="text" v-model="n1"> <sel
复制链接

扫一扫