解決“微信小程式disabled屬性不生效”的問題!
阿新 • • 發佈:2018-11-22
微信小程式中帶disabled屬性的表單元件有(點選可以進入官方文件):
button,checkbox,input,picker,radio,slider,switch,textarea
如果是固定禁用元件的話,直接放上disabled就好,簡單粗暴,如:
<!-- 自閉合標籤 -->
<input type="text" disabled />
<!-- 非自閉合標籤 -->
<picker bindchange="bindPickerChange" disabled> </picker>
重點來了,如果disabled的值是動態的靈活的,那就不一樣了,在網上看到有不少的小夥伴遇到這樣的問題。例如:
在xxx.js中,設定一個data資料變數
Page({
data: {
status: true
}
})
在xxx.wxml中,用上表單元件,很多人會覺得是<input type="text" disabled=“{{status}}” />,
disabled的結果是 disabled=“true” 或者 disabled=“false” ,
那就錯了,注意一下官方文件中,disabled的值是布林值(Boolean),而以上的字串(String),賦值“false”就是true
正確的用法應該是:
<input type="text" disabled={{status}} />
<picker bindchange="bindPickerChange" disabled={{status}}> </picker>
注意:像input這種自閉合標籤,在斜槓‘/’之前需要留一個空格,不然會報錯“ expect end-tag `input`., near `view` ”
希望這篇文章能幫助到大家,祝大家生(sheng)活(zhi)愉(jia)快(xin)!