在本文中，南京小程序开发公司将分享了微信小程序中显示复选框的具体代码供您参考。详情如下所示。
在样式部分，您可以自由发挥。无论如何，这里没有任何内容。选中并取消选中它并使用它。数据。arrStatus [检查索引]直接判断它，你以后会理解它。
效果预览：
部分JS
// page/index/index.js
Page({
/**
* Initial data of pages
*/
data: {
items: [
{name:'USA', value:'USA'},
{name:'CHN', value:'China'},
{name:'BRA', value:'Brazil'},
{name:'JPN', value:'Japan'},
{name:'ENG', value:'UK'},
{name:'TUR', value:'France'},
],
arr: [],
arrStatus: []
},
check: function (e) {
// Gets the currently selected value
var checkValue = e.currentTarget.dataset.val;
// Gets the currently selected subscript
var checkIndex = e.currentTarget.dataset.index;
// The currently selected negative value
this.data.arrStatus[checkIndex] = !this.data.arrStatus[checkIndex];
if (this.data.arrStatus[checkIndex]) {
// If the current state is selected, insert the value into the array
this.data.arr.push(checkValue);
}else{
// If the current state is unchecked, delete the value from the array and return a new array
for (var i in this.data.arr) {
if (this.data.arr[i] == checkValue) {
this.data.arr.splice(i);
}
}
}
// Print the currently selected data
console.log(this.data.arr);
},
/**
* Life Cycle Function -- Listening for Page Loading
*/
onLoad: function (options) {
// Set the status of each data in the array
for (var i in this.data.items) {
this.data.arrStatus[i] = false;
}
},
})
wxml部分：
<block wx：for ='{{items}}'>
<text data-index ='{{index}}'data-val ='{{item.value}}'catchtap ='check'> {{item。 value}} </ text>
</ block>
以上是本文的全部内容。我希望它对每个人的学习都有所帮助，我希望你能更多地支持
南京小程序开发公司！
本文地址：
http://www.njanyou.cn/web/2504.html
Tag：
专业服务：
南京网站制作,
南京网站制作公司,
南京网站建设公司
联系电话：025-65016872
上一篇：
被遗忘的搜索引擎优化任务提升排名
下一篇：
南京小程序开发公司分享微信applet日历效果
