Vue 计算属性 computed

什么是计算属性?

计算属性的重点突出在 属性 两个字上。简单说就是一个能够将计算结果缓存起来的属性。

计算属性在内存中运行。

计算属性的主要特点就是为了将不经常变化的计算结果进行缓存,以节约我们的系统开销。

复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app">
    <!--调用方法-->
    <p>currentTime1 {{currentTime1()}}</p>
    <!--调用属性-->
    <p>currentTime2 {{currentTime2}}</p>
</div>


<!--引入vue.js 包-->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
    var vm=new Vue({
        el:"#app",
        data:{
            message:"hello,ckfuture"
        },
        methods:{
            currentTime1:function () {
                return Date.now();//返回一个时间戳
            }
        },
        computed:{
            //计算属性:methods computed 方法名不能重名。
            // 重名之后,只会调用methods的方法不会调用计算属性。
            currentTime1:function () {
                return Date.now();//返回一个时间戳
            }
        }
    });

</script>
</body>
</html>
复制代码

 

posted @   创客未来  阅读(95)  评论(0编辑  收藏  举报
编辑推荐:
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
阅读排行:
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 单线程的Redis速度为什么快?
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 展开说说关于C#中ORM框架的用法!
点击右上角即可分享
微信分享提示