2024 年希望自己保持积极乐观的心态，多学习，多运动，多阅读，多思考，多实践，多总结。
管理好自己的情绪，停止内耗，全力以赴追求自己想要的生活！

• 1.通过软考高项
  • 按照课程进度听课并做练习题
• 2.前端技术精进
  • Vue 3 项目实战
  • React 18 项目实战
  • uni-app 项目实战
  • 小程序项目实战
  • ts 项目实战
• 3.提高词汇量，坚持英文原版书籍阅读
  • 每天背单词打卡
  • 每天英语听力打卡
  • 阅读英文原版书籍半小时
  • 每三个月测试词汇量
    阅读全文 »

1. 首先将 .livp 格式的文件修改后缀名为 .zip。可以使用一个批处理文件（.bat 文件）来完成这个操作。在任意一个文本编辑器中新建一个文件，输入以下命令：

1

ren *.livp *.zip

然后将这个文件保存为 .bat 格式，例如 rename_to_zip.bat。将这个文件放到需要修改后缀名的文件夹中，双击运行即可。

2. 使用 WinRAR 软件批量解压缩 .zip 格式的文件。下载并安装 WinRAR 软件，然后选中需要解压缩的文件夹，右键点击选择“解压到指定文件夹”，选择目标文件夹，点击“确定”即可完成批量解压缩。

3. 使用 HEIC Utility 软件批量将 .heic 格式的文件转换为 .jpeg 格式。下载并安装 HEIC Utility 软件，打开软件，在菜单栏选择 更多 -> 批量转换，点击右上角的 + 号，选择上一步解压的文件夹里的所有 .heic 格式的文件，在左下角设置输出目录和输出质量，最后点击“开始转换”按钮即可完成批量转换。

本文转载自 如何禁止别人调试自己的前端代码，此处仅作记录。

无限 debugger

前端页面防止调试的方法主要是通过不断 debugger 来疯狂输出断点，因为 debugger 在控制台被打开的时候就会执行。由于程序被 debugger 阻止，所以无法进行断点调试，所以网页的请求也是看不到的。
以下是使用无限 debugger 方式阻止代码调试的示例：

1
2
3
4
5
6
7
8
9
10
11
12
13

/**
 * 基础禁止调试代码
 */
(() => {
  function ban() {
    setInterval(() => {
      debugger;
    }, 50);
  }
  try {
    ban();
  } catch (err) {}
})();

简介

FLEXBOX CSS3 中的一种布局模式，它可以帮助开发者更加方便地实现自适应布局和响应式设计。FLEXBOX 基于弹性盒子模型，通过对容器和容器内元素的属性设置来实现灵活的布局。

在 FLEXBOX 中，容器是指设置了 display:flex 或 display:inline-flex 属性的元素，容器内的元素则是指容器的子元素。通过设置容器和容器内元素的属性，可以实现以下功能：

1. 弹性布局：容器内的元素可以根据容器的大小和方向自动调整位置和大小，从而实现弹性布局。

2. 对齐方式：可以通过设置 justify-content 和 align-items 属性来实现容器内元素的水平和垂直对齐。

3. 排列方式：可以通过设置 flex-direction 属性来实现容器内元素的排列方式，包括水平排列和垂直排列。

4. 元素间距：可以通过设置 justify-content 和 align-items 属性来实现容器内元素的间距和间隔。

5. 元素排序：可以通过设置 order 属性来实现容器内元素的排序，从而实现元素的前后顺序调整。

基本概念

• 主轴（main axis）是沿着 flex 元素放置的方向延伸的轴（比如页面上的横向的行、纵向的列）。该轴的开始和结束被称为 main start 和 main end。
• 交叉轴（cross axis）是垂直于 flex 元素放置方向的轴。该轴的开始和结束被称为 cross start 和 cross end。
• 设置了 display: flex 的父元素被称之为 flex 容器（flex container）。
• 在 flex 容器中表现为弹性的盒子的元素被称之为 flex 项（flex item）。

功能

后台返回数据包含年，月和日，希望实现一个柱状图，当点击年数据时，下钻到月数据，点击月数据时，下钻到日数据。并包含返回功能。

思路

通过重绘图表的方式实现，实现思路如下：

1. 默认显示年数据
2. 当点击年数据柱子时，销毁图例，使用月数据重绘图表，下钻月数据类似
3. 增加一个按钮用来返回上层图表，使用相对定位定位在图表右上方