被迫学习Vue——计算属性

た入场券 2023-07-14 12:57 1阅读 0赞

computed，跟methods差不多，他是计算属性，能缓存

<!DOCTYPE html>
    <html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script src="http://cdn.bootcss.com/vue/2.1.6/vue.min.js"></script>
    </head>
    <body>
    <div id="app">
        <p>{
       {currentTime1()}}</p>
        <p>{
       {currentTime2}}</p>
    </div>
    
    <script>
        var vm = new Vue({
         
            el: "#app", // 绑定元素，el是element的意思
            data: {
         
                msg: 'hello method'
            },
            methods: {
          //通过currentTime1()访问
                currentTime1: function () {
         
                    return Date.now();
                }
            },
            computed: {
          // 计算属性，通过currentTime2访问，有缓存
                currentTime2: function () {
         
                    return Date.now();
                }
            }
        });
    </script>
    
    </body>
    </html>

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlWmhpWWluZ18_size_16_color_FFFFFF_t_70]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlWmhpWWluZ18_size_16_color_FFFFFF_t_70]: /images/20230529/519f9a9e478c4bb6b27d256161111449.png

发表评论取消回复

表情：

评论列表（有 0 条评论，1人围观）

还没有评论，来说两句吧...

相关阅读

相关 Vue 计算属性

简介构造器的 computed 选项，用于定义 Vue 实例的计算属性。虽然模板内的表达式非常便利，但是设计它们的初衷是用于简单运算的。如果在模板中放入太多的逻...

红太狼/ 2024年04月18日 15:24/ 0 赞/ 76 阅读

相关 Vue 计算属性

1. 前言本节介绍计算属性的使用方法。包括什么是计算属性，计算属性的特点，还有计算属性和方法在实际使用中的区别。其中重点掌握计算属性和方法的区别，了解它之后，才能在日常

墨蓝/ 2024年03月27日 08:47/ 0 赞/ 71 阅读

相关 Vue学习：计算属性

计算属性我们准备是实现一个加法的计算器,当用户输入了两个数字,我们就得到这两个数字的和,效果图如下: ![695fc424d73b462383041089df8270

「爱情、让人受尽委屈。」/ 2023年10月04日 19:46/ 0 赞/ 43 阅读

相关被迫学习Vue——计算属性

computed，跟methods差不多，他是计算属性，能缓存 <!DOCTYPE html> <html lang="en" xmlns:v-on="htt

た入场券/ 2023年07月14日 12:57/ 0 赞/ 2 阅读

相关 Vue计算属性

文章目录 1、计算属性的定义 2、计算属性的缓存 3、v-for和v-if一起使用的替代方案 4、实例：购物车的实现

本是古典何须时尚/ 2022年10月19日 05:31/ 0 赞/ 46 阅读

相关【Vue】—计算属性

【Vue】—计算属性 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9

港控/mmm°/ 2022年09月03日 14:18/ 0 赞/ 206 阅读

相关 Vue计算属性

计算属性就是当其所依赖的属性的值发生变化的时候，这个属性的值会自动更新，与之相关的东西也会自己更新。计算属性可以完成各种复杂的逻辑，但是最终都要返回一个结果。计算属性可以依赖多

本是古典何须时尚/ 2022年05月20日 08:34/ 0 赞/ 323 阅读

相关 Vue的计算属性

计算属性关键词: computed。计算属性在处理一些复杂逻辑时是很有用的。可以看下以下反转字符串的例子： <div id="app"> <p>原

墨蓝/ 2021年10月20日 01:20/ 0 赞/ 391 阅读

相关 Vue计算属性

计算属性模板内的表达式非常便利，但是设计它们的初衷是用于简单运算的。在模板中放入太多的逻辑会让模板过重且难以维护。例如： <div id="example

￡神魔★判官ぃ/ 2021年10月20日 00:24/ 0 赞/ 414 阅读

相关 Vue.js学习笔记：计算属性

在模板中表达式非常便利，但是它们实际上只用于简单的操作。模板是为了描述视图的结构。在模板中放入太多的逻辑会让模板过重且难以维护。这就是为什么 Vue.js 将绑定表

Myth丶恋晨/ 2021年09月14日 01:54/ 0 赞/ 387 阅读