uni-app button disabled 问题：字符串变量为空字符串时，被禁用(true)，期望是不被禁用(false)

uni-app button disabled 问题：字符串变量为空字符串时，被禁用(true)，期望是不被禁用(false)

开发环境 版本号 项目创建方式
Mac 12.0.1 (21A559) HBuilderX

示例代码：

<button  :disabled="tt" class="btn">新增网关\保存网关</button>

data(){  
    return{  
        tt:""  
    }
}

操作步骤：

  • button disabled 字符串变量为空的情况下，被禁用

预期结果：

  • false

实际结果：

  • true

bug描述：

{
"errMsg": "getSystemInfo:ok",
"brand": "OPPO",
"model": "PDPT00",
"pixelRatio": 3,
"screenWidth": 360,
"screenHeight": 800,
"windowWidth": 360,
"windowHeight": 800,
"statusBarHeight": 38,
"language": "zh-CN",
"system": "Android 11",
"version": "1.9.9.81128",
"fontSizeSetting": "",
"platform": "android",
"SDKVersion": "",
"windowTop": 0,
"windowBottom": 0,
"safeArea": {
"left": 0,
"right": 360,
"top": 38,
"bottom": 800,
"width": 360,
"height": 762
},
"safeAreaInsets": {
"top": 38,
"right": 0,
"bottom": 0,
"left": 0
},
"deviceId": "deeed0aae3c31eed"
}

更多关于uni-app button disabled 问题：字符串变量为空字符串时，被禁用(true)，期望是不被禁用(false)的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app button disabled 问题：字符串变量为空字符串时，被禁用(true)，期望是不被禁用(false)的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这是一个常见的JavaScript类型转换问题。在Vue/uni-app中，:disabled属性接收布尔值，但你传递的是字符串""。

问题分析：

  • disabled="tt" 中的tt是空字符串""
  • 在JavaScript中，空字符串在布尔上下文中会被转换为false
  • 但在Vue的属性绑定中，字符串"false"或空字符串""会被当作真值处理

解决方案：

  1. 直接使用布尔值（推荐）：
data(){  
    return{  
        tt: false  // 直接使用布尔值false
    }
}
  1. 使用条件判断：
<button :disabled="tt === ''" class="btn">新增网关\保存网关</button>
  1. 使用!!进行显式布尔转换：
<button :disabled="!!tt" class="btn">新增网关\保存网关</button>
回到顶部