在一些开发场景中我们需要根据后端返回的状态去显示一些文字,例如 根据0 1 2来展示 未审核", "审核中", "审核通过"可以通过computed传参加枚举的方式返回 避免写多个v-if。
在vue中可以通过闭包来实现computed的传参 示例:
<template>
<div>{{stateText(1)}}</div>
</template>
<script setup>
const stateText = computed((state)=>(state)=>{
const stateArr = ["未审核", "审核中", "审核通过"];
return stateArr[state]
})
</script>
在uni-app-x中采用这种方式编译会报错,通过一个函数接受一个参数 再返回一个computed执行
<template>
<div>{{stateText(1)}}</div>
</template>
<script setup>
const stateText = (state:number):ComputedRefImpl<string>=>{
return computed(():string=>{
const stateArr = ["未审核", "审核中", "审核通过"];
return stateArr[state] as string
})
}
</script>