在vue的计算属性computed中实现传参

最新推荐文章于 2024-08-19 10:12:25 发布

Gabriel_wei

最新推荐文章于 2024-08-19 10:12:25 发布

阅读量2k

点赞数

分类专栏：前端学习

本文链接：https://blog.csdn.net/Gabriel_wei/article/details/91046981

版权

前端同时被 2 个专栏收录

183 篇文章 7 订阅

订阅专栏

学习

61 篇文章 0 订阅

订阅专栏

需求

遇到了一个需求是根据vue中传入的数据去计算是否禁用checkbox,这时候就需要实时计算，还需要将vue中的数据传入

demo

html

<Checkbox :disabled="!check(secondValue)"></Checkbox>

  computed: {
    check: function() {
    //注意：参数在这里接收
      return function(value) { 
      }
    }
  }

据说是使用了闭包

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

Gabriel_wei

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

Vue进阶系列之计算属性Computed传参

weixin_42118522的博客

04-03

1082

作为一名进击中的前端小菜鸡，当然要会用Vue呀，还得熟练应用，计算属性computed大家也一定不陌生，但是如果遇到要传参的情况要怎么处理呢？我们知道，计算属性computed和方法method的用法及作用极为相似，区别在于计算属性基于响应式依赖进行缓存，而函数在每次重新渲染都会重新求值。方法的传参我们也应用得炉火纯青，毕竟函数传参嘛，怎么好意思说不会呢？因此我们第一反应都是像方法一样在计算属性中传参。次出我们要注意区分，计算属性是个属性，不能像函数方法一样使用，直接在属性内传参，但我们可以通过返回一个

Vue中computed计算属性传参问题

qq_33718889的博客

03-12

653

Vue中computed计算属性传参问题 <template> <span>{{transmit(params)}}</span> </template> <script> export default { name: 'demo', data(){ params: 1111 }, computed:{...

参与评论您还未登录，请先登录后发表或查看评论

vue使用computed计算属性进行传参

骑着代码去流浪

10-06

1万+

需求，根据传递过来的宽高比，进行宽高的重新计算 computed:{ imgWD(o){ return function(o){ return { width:'370px', height:370*(1/o) + 'px' } } } } <div :sty...

vue计算属性传参方法

桃花岛主的博客

06-12

390

vue计算属性传参方法： list(){ return (index) =>{return this.sku_card[index].list} }，//index为参数调用方法： v-for="(item2,index2) in list(index)"

computed传参

qq_45327886的博客

07-10

609

computed属性 template,setup传参

vue3的computed计算属性传参

pig_ning的博客

10-28

2015

vue3的computed计算属性传参

vue中计算属性computed方法内传参

weixin_30898109的博客

02-22

254

vue中computed计算属性无法直接进行传参如果有传参数的需求比如说做数据筛选功能可以使用闭包函数（也叫匿名函数）实现例如：在上篇博客vue安装使用最后的成绩表练习中的过滤功能的实现： <tr v-for="(item,index) in arr" v-if="myfilter(index)"> <td>{{item.username}}&l...

vue3 computed如何传参/接受参数

红烧咸咸鱼

01-11

2165

vue3 computed如何传参/接受参数

vue中的computed计算属性传参动态设置属性

m18697787579的博客

02-18

1045

今天才知道了vue的computed属性可以传递参数如下， <el-button>{{target(2)?target(1):0}}</el-button>` computed: { target () { return function (id) { id += 1 return id } } },

vue3的计算属性传参

weixin_44905572的博客

07-13

5452

Vue2 场景大概是我写了一个贼鸡儿基础的upload组件，然后这个给showList是上传到服务器并且返回了各种上传文件信息的数组列表，如果上传的是图片，我就让他回显图片，不是图片格式我就让他显示默认图片 template <template> <div v-for="(item,i) in showList" :key="i" class="item"> <img :src="item.url" alt="请上传" class="img" v-

vue计算属性get和set用法示例

10-17

在Vue.js中，计算属性（computed properties）是实现基于依赖的值动态计算的关键特性之一。计算属性允许开发者基于其响应式依赖进行缓存，只有在依赖值改变时才会重新计算，这使得Vue能够高效地处理响应式数据。 ...

vue-async-computed, Vue.js的异步计算属性.zip

09-17

vue-async-computed, Vue.js的异步计算属性 vue-async-computed 这里插件的为Vue兼容！可以使用这个插件在Vue中计算出异步计算的属性。不使用这里插件，你无法执行这里操作：new Vue({ data: { us

Vue如何给计算属性computed传参的思考，看完就明白了！

热门推荐

qq_36437172的博客

02-07

1万+

computed：计算属性，依赖其他属性计算值，并且 computed 的值有缓存，只有当计算值变化才会返回内容（computed 的值在 getter 执行后是会缓存的，只有在它依赖的属性值改变之后，下一次获取 computed 的值时才会重新调用对应的 getter 来计算）。一般来说，需要依赖别的属性来动态获得值，有时候我们计算的值，与某个动态值关联，那我们又该如何向 computed 中传入参数呢？将计算属性返回值改为函数，再进行传值操作，同样我们使用方法也可以到达一样的效果。 comput

Vue计算属性可以传参吗

weixin_47806733的博客

09-06

8004

vue计算属性可以传参，但是不能直接传参下面举个小例子比如我们可以使用函数轻松实现 <div id="test"> <div v-for='(item,index) in songer'>{{songerName(index,item)}} </div> var app = new Vue({ el: ' #test ', data: { songer

Vue里面计算属性computed带参数的使用方式

Scorpio_sky的博客

01-18

3265

最后附上结果图片及完整测试代码< template > < h2 > 计算属性是否带参 </ h2 > < div > 不带参：result -> {{ result }} </ div > < br /> < div > 参数为5，但使用错误会报错：errResult(5) < br /> < br /> 报错提示 errResult is not a function <!

vue2 使用computed传参

红烧咸咸鱼

03-08

994

vue2 使用computed传参

vue 计算属性传参

09-15

计算属性在Vue中可以传参，通过在计算属性内部返回一个函数，并将参数作为函数的参数传入，就可以实现计算属性的传参功能。你可以在计算属性的定义中使用函数的方式来实现传参，如下所示: ```javascript computed: ...