uni-app 【报Bug】使用props传递“空字符串”时,在微信小程序中子组件中获取该参数是true

uni-app 【报Bug】使用props传递“空字符串”时,在微信小程序中子组件中获取该参数是true

类别 信息
产品分类 uniapp/小程序/微信
PC开发环境操作系统 Windows
PC开发环境操作系统版本号 Win10
HBuilderX类型 正式
HBuilderX版本号 3.2.9
第三方开发者工具版本号 1.05.2110110
基础库版本号 2.20.0
项目创建方式 HBuilderX

示例代码:

<common-select  text=""></common-select>
props: {
    text: {
        type: String,
        default: () => {
            return ""
        }
    }
}

官方的组件 依然有这个问题

<uni-badge text=""></uni-badge>

当text传空字符串时,组件内的值为true

操作步骤:

任意组件,传递空字符串,子组件接受到的值都为true

预期结果:

应为空字符串

实际结果:

显示为true

bug描述:

使用props传递 “空字符串” 时,在微信小程序中,在子组件中获取该参数是true


更多关于uni-app 【报Bug】使用props传递“空字符串”时,在微信小程序中子组件中获取该参数是true的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app 【报Bug】使用props传递“空字符串”时,在微信小程序中子组件中获取该参数是true的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这是一个已知的微信小程序平台特性问题。在微信小程序中,当父组件向子组件传递空字符串属性时,小程序底层会将其转换为布尔值 true

原因分析: 微信小程序的组件通信机制在处理属性时,会将空字符串 "" 解析为 true。这是微信小程序底层的实现逻辑,并非 uni-app 框架的问题。

解决方案:

  1. 推荐方案:使用 null 或 undefined 替代空字符串
<common-select :text="null"></common-select>
<!-- 或 -->
<common-select></common-select>
  1. 在子组件中做兼容处理
props: {
    text: {
        type: String,
        default: ""
    }
},
computed: {
    normalizedText() {
        // 处理微信小程序中空字符串转为true的问题
        return this.text === true ? "" : this.text
    }
}
  1. 使用 v-bind 绑定空字符串
<common-select :text="''"></common-select>
回到顶部