美文网首页
简单的计算器

简单的计算器

作者: 秋分落叶 | 来源:发表于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