vue教程2-03 vue计算属性的使用 computed

computed:{
        b:function(){    //默认调用get
            return 值
        }
    }
    --------------------------
    computed:{
        b:{
            get:
            set:
        }
    }

    * computed里面可以放置一些业务逻辑代码，一定记得return

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style>
    </style>
    <script src="vue.js"></script>
    <script>

    </script>
</head>
<body>
    <div id="box">
        a => {{a}}
        <br>
        b => {{b}}
    </div>
    <script>
        var vm=new Vue({
            el:'#box',
            data:{
                a:1
            },
            computed:{
                b:{
                    //业务逻辑代码,b的值完全取决于return回来的值
                    get:function(){
                        return this.a+2;//默认调用get
                    },
                    set:function(val){
                        this.a=val;
                    }
                }
            }
        });

        document.onclick=function(){
            vm.b=10;//相当于set函数传入val=10
        };
    </script>
</body>
</html>

优质内容筛选与推荐>>
1、JavaScript权威指南第03章类型、值和变量(1)
2、【枚举判断】Palindromic Squares 回文平方数 (Usaco_Training 1.2)
3、php 魔术变量 __unset()
4、PL/SQL【32位】连接Oracle 11g【64位】
5、Linux内核分析——操作系统是如何工作的

0 │ 收藏 │ 举报

朋友将在看一看看到

分享想法到看一看