(1)数组去重
考虑用set数据结构进行去重的处理,尤其在处理对象数组时,考虑去重的时候,可以直接取其中对象的主键id进行判断
首先创建一个空数组A,然后遍历想要去重的数组B,然后遍历取出B中的主键id放入到A中,然后最后进行判断,下面是demo
const A = [];
const B = [{id:'1',context:'哈哈1'},{id:'2',context:'哈哈2'},{id:'1',context:'哈哈1'}];
// 这里定义的B中有重复的对象值
for(let i=0;i<B.length;i++){
A[i] = B[i].id; // 遍历将对象B的id存入到A
}
// 最后将A转换为Set判断长度即可
if(new Set(A).size!==B.length){
console.log('B中含有重复值');
}
(2)vue中组件绑定优先考虑使用.$refs进行绑定
比如elementUI中table取消多选的操作逻辑
<el-table
ref="dialogBadCodetable" //这里绑定ref
border
:data="dialogBadCodetable.data"
height="300"
style="width:100%;"
@selection-change="DialogBadCodeTableChange"
>
... //中间内容省略
</el-table>
// 在后续的操作中 可以使用,下面是假设点击清空按钮时的操作逻辑(这里是vue中的写法)
clearTable(){
this.$refs.dialogBadCodetable.clearSelection(); // 将dialogBadCodetable置空
}
(3)前端开发如果不是vue系页面(即传统html,jsp,thymeleaf等)如果想实现select多选,回显等等,可以考虑使用xm-select
vue系: https://element.eleme.cn/#/zh-CN/component/select
非vue系:https://gitee.com/maplemei/xm-select api:https://maplemei.gitee.io/xm-select/#/component/install
(4)页面回退并刷新,可以防止用户是直接点进来的,找不到reffer页面,可能是分享进来的,下面的代码实现回退并刷新
window.location.href = document.referrer;
(5) 前端页面调试(移动端和桌面端都可用)
第一款:VConsole
<script src="http://wechatfe.github.io/vconsole/lib/vconsole.min.js?v=3.2.0"></script>
<script>
// init vConsole
var vConsole = new VConsole();
console.log('Hello world');
</script>
第二款:Eruda
<script type="text/javascript" src="https://cdn.bootcss.com/eruda/1.2.6/eruda.min.js"></script>
<script>
eruda.init();
</script>