滚动条显隐时页面不抖动 方案一属性属性 scrollbar-gutter 可以实现该功能方法在需要的地方设置 scrollbar-gutter: stable; 即可，此设置会将滚动条的位置预留出来，在没有滚动条时也占位。其他属性值auto默认效果stable both-edges和 stable 差不多，但是左右两边都会留空白位置进行占位，让内容居中兼容性scrollbar-gutter兼容性方案二overflow:overlay , overlay 属性设置后，滚动条为覆盖在上方，不会占空间导致页面抖动 Ginkgo 2023-09-18 4026
对数组进行特定场景排序，平衡多列数据个数平衡 场景：项目中对已有的工作看板进行筛选后，希望靠左排序，实现如下图示例:代码如下：function reOrder(arr) { arr = JSON.parse(JSON.stringify(arr)); if (arr.length === 1) { // 单个场景 if (arr[0].x !== 0) { arr[0].x = 0; arr[0].y = 0; } return arr; } let xMap = {}; // 根据x的值拆分对象 arr.forEach((el) => { if (!xMap[el.x]) { xMap[el.x] = []; } xMap[el.x].push(el); }); if (!xMap['0']) { xMa Ginkgo 2023-08-25 2766
js树形结构和扁平数组相互转换 来源树结构扁平化/** * 把嵌套数组转成平铺数组 * @param data <Array> * @param childName <String> 子集节点的名称 * @return newData <Array> */ const flatTree = (data, childName = 'children') => { if (!Array.isArray(data)) { console.warn('只支持传入数组') return [] } return data.reduce((prev, curt) => { // 有子节点的话把子节点作为一级节点递归遍历 const childs = curt[childName]?.length ? flatTree(curt[childName]) : [] return [...prev, curt, ...childs] }, []) } const ge Ginkgo 2022-10-19 4994
