uni-appX类型不匹配

uni-appX类型不匹配

const color  = computed( ():string  =>{  
    return num.value == 1 ? '红色' :'黑色'  
})  

报错:error: 类型不匹配: 推断类型是String，但预期的是Boolean

//把html代码注释掉就不报错

```view
<text>{{color ? color :''}}</text>
开发环境 版本号 项目创建方式

更多关于uni-appX类型不匹配的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-appX类型不匹配的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这个错误是由于条件表达式在模板中的使用方式导致的。在uni-appX中，当你在模板中使用三元表达式时，整个表达式的类型需要保持一致。

在你的代码中，color是一个计算属性，返回的是字符串类型(‘红色’或’黑色’)。但在模板中你使用了{{color ? color :''}}这样的条件渲染，这里实际上是在检查color的布尔值。

解决方案有两种：

  1. 直接显示color的值（如果不需要空值判断）：
<text>{{color}}</text>
  1. 如果需要空值判断，可以修改为：
<text>{{color !== '' ? color : ''}}</text>

或者保持计算属性的类型一致性，修改计算属性返回布尔值：

const color = computed((): boolean => {
    return num.value == 1
})

然后在模板中根据布尔值显示不同文本：

<text>{{color ? '红色' : '黑色'}}</text>
回到顶部