4.计算属性

可以把计算属性理解为缓存

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--view层-->
<div id="vue">
    <p>{{currentTime1()}}</p>
<p>{{currentTime2}}</p>
</div>

<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
<script>
    var vm = new Vue({
        el: '#vue',
        data: {
            message: "hello"
        },
        //methods和computed不能重名，重名的话只会使用methods的方法
        methods:{
            currentTime1:function () {
                return Date.now();//返回一个当前时间戳
            }
        },
        computed:{//计算属性
            currentTime2:function () {//可以想象为缓存
                return Date.now();//返回一个当前时间戳
            }
        }
    });
</script>
</body>
</html>

效果如图

 

 函数可以作为属性而存在了

posted @ 2021-06-29 22:07  一拳超人的逆袭  阅读(30)  评论(0)  编辑  收藏  举报