对于多选框数据处理的总结
近期项目遇到了多选框的需求,过程中遇到了些问题,后来经过优化较好实现了需求,现做总结以便日后借鉴。界面布局大致如下图:
初期拿到需求后,脑海中第一感觉是:选中的时候给数组中push对应项的id,取消的时候从数组中找到对应项并删除id,最后拼装好的数组就是需要提交到后台去请求接口的。开发过程中渐渐发现这种方法的一个主要缺点:繁琐!
改进后的方法是,在点击多选框的时候不去做数据处理,只展示点击效果。最后在请求数据之前,再去赋值,即哪一项选中就给数组中存对应项的id。这样就少去了取消选中从数组中删除对应项id的处理,减少了代码量。
当然,还是需要看具体需求,但是这种方法适用于大多数情景。
最后,记录一个常用的数组去重方法:
var a=[1,2,3,2,2,23,4,3]; var b=[]; for(var i=0;i<a.length;i++){ if(b.indexOf(a[i])===-1){ console.log("b中没有重复的这一项,就存进去,达到‘去重’的目的"); b.push(a[i]); } } console.log(b);
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步