Vue入门之计算属性Computed

最新推荐文章于 2024-04-02 10:39:22 发布

cgl_dong

最新推荐文章于 2024-04-02 10:39:22 发布

阅读量97

点赞数

分类专栏： Vue 前端 javascript

本文链接：https://blog.csdn.net/weixin_43688691/article/details/97663549

版权

前端同时被 3 个专栏收录

21 篇文章 0 订阅

订阅专栏

Vue

9 篇文章 0 订阅

订阅专栏

javascript

9 篇文章 0 订阅

订阅专栏

Vue中提供了计算属性，计算属性似乎与methods非常相似，如下

<body>
<div id="ct">
    <h1>{{firstname}} {{lastname}}</h1>
    <h1>{{getFullname()}}</h1>
    <h1>{{Fullname}}</h1>
</div>
<script>
    var x=new Vue({
        el:"#ct",
        data:{
            firstname:"Tom",
            lastname:"Blue"
        },
        methods:{
            getFullname(){
                console.log("getFullname方法。。。");
                return this.firstname+" "+this.lastname;
            }
        },
        computed:{
            Fullname(){
                console.log("Fullname计算属性。。。");
                return this.firstname+" "+this.lastname;
            }
        }
    })
</script>
</body>

Tom Blue
Tom Blue
Tom Blue

实际中method每次都会执行，而computed则不会，计算属性相当于属性，有缓存，不会每次调用都执行。

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

cgl_dong

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Vue入门之计算属性Computed

Vue中提供了计算属性，计算属性似乎与methods非常相似，如下<body><div id="ct"> <h1>{{firstname}} {{lastname}}</h1> <h1>{{getFullname()}}</h1> <h1>{{Fullname}}</h1&gt...
复制链接

扫一扫