Haorooms博客-前端博客-前端技术，记录web前端开发的技术博客

【小算法】将数组处理成树状结构

2021年4月8日

前言

将数组处理成树状结构，也是在工作中经常遇到的，今天就和大家一起分享一下思路和方法。

案例

如下代码，处理成树状结构，要求程序具有容错能力，也就是可以判断输入出错。

let haoroomsDataArr = [
  { id: 1, name: "haorooms1" },
  { id: 2, name: "haorooms2", parentId: 1 },
  { id: 4, name: "haorooms4", parentId: 3 },
  { id: 3, name: "haorooms3", parentId: 2 },
  { id: 8, name: "haorooms18", parentId: 7 },
];

[阅读更多]

【小算法】相连数字数组，用横杠起止简写

2021年3月31日

前言

本题是工作中用到的一个小的算法题目，刚刚做的时候，走了一下弯路，其实思路对了，解起来很简单。下面来解析一下。后期我会整理一份常用的算法题目，每个题目都会录制成视频，和大家一起分享解题思路。有些也会借鉴leecode中的一些题目。

题目

// 一组数字，相连的用-拼接，不相连的直接写数字本身，
//例如[1,3,4,5,8,9,12,13,14,15,20]可以写成1;3-5;8-9;12-15;20这种形式。

[阅读更多]

antd拖拽列导致触发table排序问题，解决方案

2021年3月28日

前言

antd 的table表格拖拽列，会导致触发排序问题，解决方案如下，相当于加一个点击的事件判断，如果是拖拽，则不触发。

解决代码如下：

[阅读更多]

跨域图片下载JFIF格式解决方案及前端zip包下载

2021年3月20日

前言

之前文章有写过图片下载，同域名图片，只要添加download就可以下载下来，但是download在跨域图片中不起作用，因此，可以用canvas方式或者xhr方式下载。但是呢，通过canvas或者xhr下载下来的图片，在win10上面，可能会变成怪异的JFIF，这个如何解决呢？

解决方案

推荐使用file-saver 这个库

[阅读更多]

html5图片 srcset、sizes 属性和 picture 元素

2021年3月13日

前言

关于图片img的响应属性srcset,和sizes及picture，很久之前看过，但是因为浏览器兼容原因，一直没有在项目中使用，但是最近发现，这几个属性兼容性还可以了，可以去caniuse中看一下，基本可以在项目中使用了。今天，简单介绍一下这几个属性。

srcset 和 sizes 属性

srcset 是一个包含一个或多个源图的源图容器，不同源图用逗号分隔，每一个源图由下面两部分组成：

1、图片 URL

2、 x （像素比描述）或 w （图片像素宽度描述）描述符（与图片 URL 相隔一个空格）， w 描述符的加载策略是通过 sizes 属性里的声明来计算选择的

[阅读更多]