最近碰到一个需求,有一个页面有三个认证,这三个认证会变更.就是说可能这期是认证A,认证B,就可以进行下一步.但是下期就变成B,认证C了.需求希望针对这三个开关做成这样,开关A,开关B,开关C,都有三种状态.1,2,3.1为必须做,2,为选做一个.3为不做.如果三个开关配置成:[1,2,3],那就代表开关A,开关B都要做,开关C不用做.(ps: 选择做一个的是指,如果有两个开关状态都是2,则2选一,如果有3个开关状态为2,则3选一.但是如果只有一个开关状态为2,则这个必须做).进入下一个页面的条件就是,这三个开关必须按照配置项做了.
目前设计的方案为:
其中,A,B,C代表三个开关,switch代表开关状态,flag代表开关是否完成.
代码实现:
checkField: function () {
var flagSwitch = true,
choiceFlag = true;
//这里a,b,c是为了简单命名的,在这里分别代表含义: 开关A,开关B,开关C
//flag,含义: 是否已经做了开关A,开关B,开关C.statusFlagA,statusFlagB,
//statusFlagC,的取值可能性分别为1,0.(做或者没做)
//switch,含义: 开关获取的结果.switchSet[0]代表开关A获取的结果,switchSet[1]代表开关B获取的结果,switchSet[2]代表开关C获取的结果.
//定义数据结构.
var obj = {
a: {
flag: statusFlagA,
switch: switchSet[0]
},
b: {
flag: statusFlagB,
switch: switchSet[1]
},
c: {
flag: statusFlagC,
switch: switchSet[2]
}
};
//如果开关数组中有一个是可选,则可选标识choiceFlag置为false.
switchSet.forEach(function (elem) {
if (elem == 2) {
choiceFlag = false;
}
});
//遍历obj,查看obj中数据,进行判断是否显示下一步.
['a', 'b', 'c'].forEach(function (val) {
if (obj[val].switch == 1) {
if (!obj[val].flag) {
flagSwitch = false;
return false;
}
} else if (obj[val].switch == 2) {
if (!choiceFlag && obj[val].flag == 1) {
choiceFlag = true;
}
}
});
return (flagSwitch && choiceFlag);
},
写到这里,代码实现的核心就完了.
翥于2017.9.13简记
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。