1. 程式人生 > >解決“微信小程式disabled屬性不生效”的問題!

解決“微信小程式disabled屬性不生效”的問題!

微信小程式中帶disabled屬性的表單元件有(點選可以進入官方文件):

buttoncheckboxinputpickerradiosliderswitchtextarea

 

如果是固定禁用元件的話,直接放上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)!