Vue学习(基础篇)——计算属性的使用

计算属性在Vue中使用得很广泛,是Vue必不可缺少的一部分,我会带大家循序渐进的学习计算属性,首先看个例子。

Vue学习(基础篇)——计算属性的使用

我们在使用多个data数据是可以这样写,但如果我们需要10个,甚至更多的字段属性进行展示,则需要些更多的拼接,这样html代码则可以太多了,但我们可以想个办法将你需要的字段先拼接好,然后展示到页面上。

首先一个方法,我们可以使用方法method,定义个方法,在方法里进行拼接操作,请看下面的代码。

Vue学习(基础篇)——计算属性的使用

我们定义个getFullName方法,在Vue内将字段进行操作,可以实现效果,但一般我们使用方法是实现功能的,这里使用方法则不合适,Vue中定义计算属性来实现,请看下面的代码:


Vue学习(基础篇)——计算属性的使用

计算属性使用 computed关键字,在computed中定义fullName方法,我们返回的时候可以把fullName当做字段属性进行页面的展示。一般情况下使用计算属性更加的规范,而且字段属性加载的时候只会加载一次,而使用method方法则每次都会调用,在性能方面也是使用计算属性更好。

如果我有说的不好的地方,欢迎大家指正!

展开阅读全文

页面更新:2024-05-09

标签:属性   都会   循序渐进   字段   美文   使用方法   请看   法则   例子   加载   定义   操作   页面   代码   基础

1 2 3 4 5

上滑加载更多 ↓
推荐阅读:
友情链接:
更多:

本站资料均由网友自行发布提供,仅用于学习交流。如有版权问题,请与我联系,QQ:4156828  

© CopyRight 2020-2024 All Rights Reserved. Powered By 71396.com 闽ICP备11008920号-4
闽公网安备35020302034903号

Top