前言
之前做wex5的时候踩过wex5的坑,现在对自己实现的单选以及多选做一个实例总结,并且wex5的文档上也有详细的说明,其中主要的就是data组件添加字段控制,如下图
创建一个data组件并且给与两个字段fcheck以及fState,通过点击事件改编组件的值的状态
多选(通过点击事件修改data值):
单选(通过点击事件执行下列函数修改data属性,具体参考文档自带的淘宝项目):
//单选后的页面效果
Model.prototype.proClick = function(event){
var data=this.comp("proData");
data.setValue("fState","0",data.find(["fState"],["1"],true,true,true)[0]);
var row = data.getCurrentRow();
data.setValue("fState","1",row);
};
单选选中后还会有一个样式的改变
.tb-typelist .col{ padding-left:0; padding-right:5px;}
.tb-typelist .col h5{ line-height:30px; border-radius:5px; background-color:#eee; font-size:12px;}
.tb-typelist .col h5.current{ background-color:#2fa4e7; color:#fff;}