vue中computed计算属性无法直接进行传参

如果有传参数的需求比如说做数据筛选功能可以使用闭包函数(也叫匿名函数)实现

例如:

在上篇博客vue安装使用最后的成绩表练习中的过滤功能的实现:

<tr v-for="(item,index) in arr" v-if="myfilter(index)">
<td>{{item.username}}</td>
<td>{{item.sex}}</td>
<td>{{item.grade}}</td>
<td>
<a href="#" @click="delClick(index)">删除</a>
</td>
</tr>

computed计算属性:

export default {
name: 'Achievement',
data () {
return {
...
}
},
methods: {
...
},
computed: {
myfilter() {
return function(index){
return this.arr[index].username.match(this.name)!==null;
}
}
}
}

vue中计算属性computed方法内传参的更多相关文章

  1. 浅谈Vue中计算属性computed的实现原理

    虽然目前的技术栈已由Vue转到了React,但从之前使用Vue开发的多个项目实际经历来看还是非常愉悦的,Vue文档清晰规范,api设计简洁高效,对前端开发人员友好,上手快,甚至个人认为在很多场景使用V ...

  2. 浅谈Vue中计算属性(computed)和方法(methods)的差别

    浅谈Vue中计算属性(computed)和方法(methods)的差别 源码地址 methods方法和computed计算属性,两种方式的最终结果确实是完全相同 计算属性是基于它们的响应式依赖进行缓存 ...

  3. Vue.js 计算属性(computed)

    Vue.js 计算属性(computed) 如果在模板中使用一些复杂的表达式,会让模板显得过于繁重,且后期难以维护.对此,vue.js 提供了计算属性(computed),你可以把这些复杂的表达式写到 ...

  4. vue中计算属性的get与set方法

    计算属性get set方法 在vue的计算属性中,所定义的都是属性,可以直接调用 正常情况下,计算属性中的每一个属性对应的都是一个对象,对象中包括了set方法与get方法 computed:{ ful ...

  5. vue的计算属性与方法的不同

    计算属性 vue的模板里可以使用表达式,但是它的设计初衷是用于简单计算,在模板中放入太多逻辑会让模板过重且难以维护.例如: <div id="example"> {{ ...

  6. Vue之计算属性Computed和属性监听Watch,Computed和Watch的区别

    一. 计算属性(computed) 1.计算属性是为了模板中的表达式简洁,易维护,符合用于简单运算的设计初衷. 例如: <div id="app"> {{ myname ...

  7. vue的计算属性computed和监听器watch

    <template> <div> this is A.vue <br> <!--计算属性--> <label for="msg" ...

  8. vue中计算属性中的set和get

    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <body& ...

  9. Vue中计算属性(computed)和监听属性函数watch的比较

    1.计算属性适用的情形我们可能会有这样的需求,一个数据属性在它所依赖的属性发生变化时,也要发生变化,这种情况下,我们最好使用计算属性.例如在下面这个例子中,如果我们使用监听函数,代码就会变得有点冗余. ...

随机推荐

  1. Python爬虫之12306-分析请求总概述

    python爬虫也学了一段时间了.也爬过不少网站,最后我想用12306抢票器这个项目做一个对之前的学习的效果成见也是一个目标(开始学爬虫的时候,看到说,会爬12306,就会爬80%的网站),本人纯自学 ...

  2. hibernate 一对多 取多方数据重复问题,FetchMode.JOIN、FetchMode.SELECT、FetchMode.SUBSELECT区别

    问题描述:稿件附件表数据时出现多条重复数据. 介绍: 表:稿件实体Manuscripts (数据库表MANUSCRIPTS),稿件附件实体ManuscriptsAtt(表MANUSCRIPTS_ATT ...

  3. [转]Jupyter默认目录和默认浏览器修改

    转摘于:https://blog.csdn.net/caterfreelyf/article/details/79774311 1.打开cmd,首先进入到Jupyter的安装目录,我的是在D:\Pyt ...

  4. 手把手详解持续集成之GitLab CI/CD

    一.环境准备 首先需要有一台 GitLab 服务器,然后需要有个项目:这里示例项目以 Spring Boot 项目为例,然后最好有一台专门用来 Build 的机器,实际生产中如果 Build 任务不频 ...

  5. window 服务器 安装 sql server 2008 r2 express 并启用远程访问

    目前市面上的数据库服务器虽然好,但是并不便宜,一个月数千RMB, 我们可以通过在已有的数据库上自建数据库来解决 目前已知的SQL Server 2008 R2的版本有: 企业版.标准版.工作组版.We ...

  6. pypi pack and upload

    upload 403 error need to change the name in setup.py upload 400 error need to change the version of ...

  7. IBOS二次开发之视图创建(PHP技术)

    在 views 文件夹,我们创建一个跟控制器名称一样的文件夹list,新建一个index.php的视图文件. 我们讨论过多次,最后决定IBOS的视图机制还是以高效为主.因此我们没有使用模板,而是直接使 ...

  8. Nginx 文件下载 apk 文件下载不了

    通过nginx 做下载服务器 下载 apk 安装包, 出现错误502和 499. 解决办法在 nginx的  mime.types 中 来自为知笔记(Wiz)

  9. vim 使用学习操作

    1 跳转 命令 作用 h 光标向左移动 l 光标向右移动 j 光标向上移动 k 光标向下移动 w 移动光标到下一个单词开头. e 移动光标到下一个单词结尾 b 移动光标到上一个单词. 0 移动光标到本 ...

  10. C语言的整型溢出问题 int、long、long long取值范围 最大最小值

    类型名称 字节数 取值范围 signed char 1 -128-+127 short int 2 -32768-+32767 int 4 -2147483648-+2147483647 long i ...