vue3.2 computed 方法,提示提示报错:This expression is not callable.Type ‘String’ has no call signatures.ts
(property) getIcon: string This expression is not callable.Type ‘String’ has no call signatures.ts(
problem
<script setup lang="ts">
import { computed } from 'vue';
const getIcon = computed((path) => 'https://cdn.xxxx/example/' + path + '.png')
</script>
<template>
<!-- ts提示 This expression is not callable.Type 'String' has no call signatures.ts-->
<img :src="getIcon(item1.icon)" mode="widthFix"></img>
</template>
reason
getIcon 定义这个computed方法返回的是属性,但是实际调用方式却是方法
solution
// before
const getIcon = computed((path) => 'https://cdn.xxxx/example/' + path + '.png')
// after
const getIcon = computed(()=>{
return (path:string) => 'https://cdn.xxxx/example/' + path + '.png'
})