zoukankan      html  css  js  c++  java
  • vue简单的计算器

    vue实力超简单的计算器

    <div id="app">
            <input type="text" v-model="n1">

            <select v-model="obt">
                <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, //input值默认为0
                    n2: 0,
                    result: 0,
                    obt: '+' //方法默认为+
                },
                methods: {
                    calc() { //计算器算术的方法
                        //逻辑:
                        switch (this.obt) {
                            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;
                        }
                    }
                }
            })
        </script>

    本文来自博客园,作者:Face丶,转载请注明原文链接:https://www.cnblogs.com/fist/p/13068370.html

  • 相关阅读:
    linux_ssh用户枚举猜测
    Nginx 主配置文件参数详解
    OSI七层模型
    linux-Python升级安装
    qt多线程
    python 对串口的操作
    keil 下模拟u-boot的cmd功能
    <转载>CentOS 6.3下Samba服务器的安装与配置
    Magento开发完整指南
    飞书信(Facebook Messenger)是什么?
  • 原文地址:https://www.cnblogs.com/fist/p/13068370.html
Copyright © 2011-2022 走看看