工具备忘录

104 阅读1分钟

IndexedDB工具库

localforage

使用类似localStorage的简单api,但是底层使用的IndexedDB
localforage.setItem('user',user)
localforage.getItem('user').then(user =>{
   console.log(user) // 存储数据
})
// 或
const user = await localforage.getItem('user')

Chii

生成一个控制台调试无法打开控制台的浏览器,例如微信公众号文章

1.下载

npm install chii -g

2.使用

chii start -p 8080

3.添加脚本文件到根html

<script src="http://localhost:8080/target.js"></script>

4.打开http://localhost:8080

5.点击inspect 643051bb321be2a84cb5b5b2d0afce5.png

jsonrepair

这个工具是为了解决类似“非标准 JSON”问题的,它会尽可能地补全缺失引号、逗号,甚至处理 Unicode 异常字符。

解析json函数最终方案
function parseJson(jsonString) {
  // 第一步:尝试标准JSON解析
  try {
    return JSON.parse(jsonString);
  } catch (e) {
    console.log("标准JSON解析失败,尝试修复...");
    
    // 第二步:尝试使用jsonrepair修复
    try {
      const { jsonrepair } = require('jsonrepair');
      const fixedJson = jsonrepair(jsonString);
      return JSON.parse(fixedJson);
    } catch (e2) {
      console.log("修复失败,尝试使用JSON5解析...");
      
      // 第三步:尝试使用JSON5解析
      try {
        const JSON5 = require('json5');
        return JSON5.parse(jsonString);
      } catch (e3) {
        // 最后:如果所有方法都失败,返回错误信息
        console.error("所有解析方法都失败了:", e3);
        throw new Error("无法解析JSON数据");
      }
    }
  }
}
折线图点击识别坐标
    lineEcharts.off('click'); 
    lineEcharts.getZr().on('click', (params) => {
      let pointInPixel = [params.offsetX, params.offsetY];
      if (lineEcharts.containPixel('grid', pointInPixel)) {
          let pointInGrid = lineEcharts.convertFromPixel({
              seriesIndex: 0
          }, pointInPixel);
          let xIndex = pointInGrid[0];
          let handleIndex = Number(xIndex);
          const op: any = lineEcharts.getOption();
          const name = op.xAxis[0].data[handleIndex]; 
          if (this.props.onChartClick) {
              this.props.onChartClick(name);
            }
      }
  });