简单计算器

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        
        <div id="app">
            <h1>简易计算器</h1>
                <div>
                    
                
            <span>数值A</span>
            <span>
                <input type="text" v-model:value = 'numA'>
            </span>
            </div>
            <div>
                    
                
            <span>数值B</span>
            <span>
                <input type="text" v-model:value = 'numB'>
            </span>
            </div>
            <div>
                <button v-on:click = "fs">计算</button>
            </div>
            <div>
                <span>计算结果:</span>
                <span>{{sum}}</span>
            </div>
            
            
        </div>
    </body>
   <script type="text/javascript" src="js/vue-2.6.12.js" ></script>        
        
    <script type="text/javascript">
        var app = new Vue({
            el:"#app",
            data:{
                numA:'',
                numB:'',
                sum:''
            },
            methods:{
                fs:function(){
                    this.sum = parseInt(this.numA)+parseInt(this.numB)
                }
            }
        });
        
    </script>
</html>
原文地址:https://www.cnblogs.com/lxn521/p/13728044.html