计算属性 computed（简洁）

最新推荐文章于 2024-10-04 00:46:18 发布

Ciwei蓝

最新推荐文章于 2024-10-04 00:46:18 发布

阅读量201

点赞数

分类专栏： 2022Vue学习笔记文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/Blue54/article/details/127319908

版权

2022Vue学习笔记专栏收录该内容

54 篇文章 1 订阅

订阅专栏

基础：

计算属性在我们的Vue中是相当常见的，很多的业务逻辑中我们都有遇到过需要用到计算属性的地方，下面是小编为大家展示计算属性最简单粗暴的用法，是不是很简单呢，其实在我们的项目开发中计算属性可以写很多复杂的逻辑。比如我们在一个报表中有一列是展示员工工资，我们这一列的得数是依照前面各项总和再根据各种汇算我们为了dom代码中的简洁，完全可以利用到我们的计算属性

例子:

<body>
  <div id="app">
    {{ message }}<br>
    您的银行卡余额为{{b}}
  </div>
</body>
<script>
  var app = new Vue({
    el: '#app',
    data: {
      message: '你好，几何心凉!',
      a:3,
    },
    computed: {
      b: function () {
        return this.a + 1;
      }
    }
  })
</script>