美文网首页
计算属性 vue简单求和

计算属性 vue简单求和

作者: 是你的大颖儿 | 来源:发表于2018-09-17 18:00 被阅读0次

    例图:


    QQ图片20180917175801.png

    html 代码:

     <div class="app">
           <button @click="add">加货</button>
           <p>{{tal}}</p>
     </div>
    

    js 代码:

    <script src="vue.js"></script>
    <script>
        new Vue({
            el:".app",
            data:{
                arr1:{cont:5,pric:3},
                arr2:{cont:8,pric:4},
            },
          
            computed:{
                tal:function(){
                return    this.arr1.cont*this.arr1.pric+this.arr2.cont*this.arr2.pric
                }
            },
            methods:{
                add:function(){
                    this.arr1.pric++
                }
            }
        })
    </script>
    

    相关文章

      网友评论

          本文标题:计算属性 vue简单求和

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