简单的计算器

2019-06-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>

上一篇下一篇

猜你喜欢

热点阅读