添加链接
link管理
链接快照平台
  • 输入网页链接,自动生成快照
  • 标签化管理网页链接

需求:我们需要根据接收值中的type字段,去判断应该解析名称为“主叫名称”还是“被叫名称”

因为计算属性具有缓存效果,所以我们期望用计算属性去获取(当然,过滤器也能使用,方法有很多,这里不用较真)
所以,这里我们就要想办法把我们的值当做参数传进去。
官网并没解释计算属性应该怎么传值,但是呢,计算属性都会返回一个值,基于这个条件,我们就想到了另一个只知识点 闭包

闭包:闭包就是能够读取其他函数内部变量的函数,简单点说,就是嵌套函数(关于闭包的解释和使用,大家可以查阅相关资料,这里就不过多赘述了)

有了思路,我们就开始试试看

<template>
	<p>{{ getCallerName(callRecord) }}</p>
 </template>
<script>
export default {
	props: {
		callRecord: {
			type: Object,
            default: () => ({}),
	computed:{
		// 获取名称
        getCallerName() {
        	return callRecord => {
                if (callRecord.type === 1 || callRecord.type === 2) return callRecord.callerName;
                return callerInfo.callerNumber;

观察两段代码可以看出,我们在计算属性里return了一个函数,这个函数的参数即我们传入的值,而内部也能直接拿到并使用这个值,这样就做到了计算属性传参(当然,多个参数也是可行的)
好了,以上就是对计算属性如何传参的介绍使用

如有问题,请指出,接受批评

期待能够对你有所帮助~

computed可以传参 学习Vue有一段时间了,一开始一直会有一个误区——computed计算属性无法和methods事件一样进行参数的传递。 很神奇的事情发生了,使用闭包可以在computed中获取到标签中传来的值并且处理完之后return回去结果,废话不多说,下面就是个小例子!!!!! computed(){ arguments(){ return function(a){ return a arguments(250) // 250 在实际项目中的使用 在 Vue 中,计算属性是一种方便的方式来处理复杂的逻辑和动态计算,而且它们也可以接受参数。通过传递参数给计算属性,你可以根据参数的不同值来返回不同的计算结果。计算属性是一个返回函数的计算属性。在模板中,我们可以像调用普通函数一样调用这个计算属性,并传递一个参数来计算折扣后的价格。需要注意的是,在计算属性内部使用函数来接受参数,这样可以确保计算属性在每次使用时都可以根据参数重新计算,而不会缓存结果。这只是一个简单的示例,你可以根据自己的需求传递不同的参数给计算属性,从而实现更复杂的计算逻辑。