美文网首页
简单的计算器

简单的计算器

作者: 秋分落叶 | 来源:发表于2019-06-11 15:11 被阅读0次

    <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;

                default:

                this.result = parseInt(this.n1) / parseInt(this.n2)

                  break;

              }

            }

          }

        })

      </script>

    相关文章

      网友评论

          本文标题:简单的计算器

          本文链接:https://www.haomeiwen.com/subject/iojqfctx.html