<checkbox-group bindchange="checkboxChange">
<label class="checkbox" wx:for="{{items}}">
<checkbox value="{{item.name}}" checked="{{item.checked}}" />{{item.value}}
</label>
</checkbox-group>
Page({
data: {
items: [
{name: "USA", value: ""},
{name: "CHN", value: "", checked: "true"},
{name: "BRA", value: ""},
{name: "JPN", value: ""},
{name: "ENG", value: ""},
{name: "TUR", value: ""},
]
},
checkboxChange(e) {
console.log("checkboxchangevalue:", e.detail.value)
}
})
this is an example of Mini Program checkbox. I hope that < checkbox value= "{{item.name}" checked= "{{item.checked}}" / >
the selected status can be determined based on the data. For example, in the above code,
checkboxChange(e) {
console.log("checkboxchangevalue:", e.detail.value)
this.setData({
// true
items[0]: {name: "USA", value: "", checked: true}
})
}
The effect of is similar to the controlled component of react
. Because it is necessary to judge some logic to confirm whether it can be selected before it is selected. But I just started to be Mini Program, and I found that it didn"t work. I don"t know what to do. I hope to judge some logic before changing the state after clicking the checkbox. Ask the boss for advice. Thank you