Vue的Computed的使用

Vue的Computed的使用

相关Html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>名称案例</title>
    <script src="../js/vue-2.4.0.js"></script>
</head>
<body>
<div id="app">

    <input type="text" v-model="firstname">+
    <input type="text" v-model="lastname" >=
    <input type="text" v-model="fullname">

</div>

<script>

    var vm = new Vue({

        el: "#app",
        data: {
            firstname: "",
            lastname: ""
        },
        methods: {
        },
        watch: {
        },
        computed:{
            // 在 computed 中,可以定义一些 属性,这些属性,叫做 【计算属性】, 计算属性的,本质,就是 一个方法,只不过,我们在使用 这些计算属性的时候,是把 它们的 名称,直接当作 属性来使用的;并不会把 计算属性,当作方法去调用;

            // 注意1: 计算属性,在引用的时候,一定不要加 () 去调用,直接把它 当作 普通 属性去使用就好了;
            // 注意2: 只要 计算属性,这个 function 内部,所用到的 任何 data 中的数据发送了变化,就会 立即重新计算 这个 计算属性的值
            // 注意3: 计算属性的求值结果,会被缓存起来,方便下次直接使用; 如果 计算属性方法中,所以来的任何数据,都没有发生过变化,则,不会重新对 计算属性求值;
            'fullname':function () {
                return this.firstname+this.lastname;
            }
        }
    })


</script>


</body>
</html>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏青玉伏案

窥探Swift之函数与闭包的应用实例

今天的博客算是比较基础的,还是那句话,基础这东西在什么时候都是最重要的。说到函数,只要是写过程序就肯定知道函数是怎么回事,今天就来讨论一下Swift中的函数的特...

2005
来自专栏社区的朋友们

sizeof 知多少? (下)

稍熟悉 C/C++ 的朋友,对于 sizeof 肯定不陌生,通过它我们可以知晓某个类型或者实例的内存大小( 以字节计 ),网上关于这个话题的信息其实挺多的,但是...

1160
来自专栏CSDN技术头条

12个非常有用的JavaScript技巧

在这篇文章中,我将分享12个非常有用的JavaScript技巧。这些技巧可以帮助你减少并优化代码。 1) 使用!!将变量转换成布尔类型 有时,我们需要检查一些变...

2176
来自专栏杂文共赏

Go中没有按引用传递

在Go中两个变量共享同一块内存区域是不可能的。但是两个变量指向的实际存储位置是可以一样的,但这不同于两个变量共享相同的存储区域。

1921
来自专栏搞前端的李蚊子

js实现深拷贝和浅拷贝

浅拷贝: 思路----------把父对象的属性,全部拷贝给子对象,实现继承。 问题---------如果父对象的属性等于数组或另一个对象,那么实际上,子对象获...

3878
来自专栏hbbliyong

12个非常有用的JavaScript技巧

在这篇文章中,我将分享12个非常有用的JavaScript技巧。这些技巧可以帮助你减少并优化代码。  1) 使用!!将变量转换成布尔类型 有时,我们需要检查...

2707
来自专栏Python攻城狮

Javascript(1)-js入门

这里主要指字符串的各种函数 str.length() 获取字符串长度 str.charAt(index)获取指定位置的字符 str.indexOf(cha...

924
来自专栏运维小白

9.4sed(上)

sed工具 sed -n '5'p test.txt sed -n '1,5'p test.txt sed -n '1,$'p test.txt sed -n ...

1868
来自专栏LEo的网络日志

c库函数strncat出现乱字符

3897
来自专栏JavaEdge

后端开发必备JavaScript函数1 Array 对象2 String对象

632

扫码关注云+社区

领取腾讯云代金券