杂七杂八的记录

ie浏览器上传文件报错

	原因:上传的路径带有中文
	解决办法:encodeURI(url)

js对中文排序

	使用方法String.localeCompare()
	正常情况下:"张三".localeCompare("李四",'zh')
	一般工作中都会用a.localeCompare(b,'zh')的形式
	在谷歌浏览器中a为null的时候会报错,在ie中a||b为null都会报错
	所以我写成了这样(a|| "").localeCompare(b || "", "zh")

webpack中导入文件的时候使用@/

const path = require('path');
module.exports = {
  //...
  resolve: {
    alias: {
    	// 不用写相对路径
      '@': path.resolve('src'),
      // 导入的时候可以不用写扩展名
      extensions:['...','js','jsx','json']
    },
  },
};

iframe实现pdf预览

<iframe src="./demo.pdf" id="iframe" frameborder="0"></iframe>

iframe实现pdf预览并自动充满屏幕

#view=FitH,top
这个只能是pdf地址,本地的线上的都可以
如果是一个页面地址,返回的pdf并不能自动充满屏幕

<iframe src="./demo.pdf#view=FitH,top" id="iframe" frameborder="0"></iframe>

#toolbar=0
隐藏工具栏
#toolbar=1
显示工具栏

<iframe src="./demo.pdf#view=FitH,top&toolbar=0" id="iframe" frameborder="0"></iframe>

通用的从数组中查找item返回某个字段

/**

 * @des:查找到值后返回其值
 */
export const findArrayReturnValue = (
  { origin, property, value, findKey } = {
    /** 原始数据 */
    origin: [],
    /** 需要对比的字段 */
    property: '',
    /** 需要对比的值 */
    value: '',
    /** 需要返回的字段 */
    findKey: '',
  },
) => {
  return origin.find((x) => x[property] === value)?.[findKey];
};

处理Tree数据

/** 处理Tree数据 */
export function postTreeData(arr, config) {
  const { children, label, value, type } = config;
  function loop(arr) {
    arr.forEach((x) => {
      /** 只允许选中子节点 */
      if (type === 'parentdisselectable') {
        if (Array.isArray(x[children])) {
          x.selectable = false;
          x.checkable = true;
          x.disableCheckbox = true;
          loop(x[children]);
        }
      }
    });
  }
  loop(arr);
  return arr;
}

通过e.target 获取所有父节点的class名字

/** 获取所有父节点 */
export function getParentNodeList(node) {
  let arr = [];
  loop(node);
  return arr;
  function loop(node) {
    if (node) {
      if (node?.parentNode) {
        arr.push(node.parentNode.className);
        if (node.parentNode.tagName !== 'BODY') {
          loop(node?.parentNode);
        }
      }
    }
  }
}

使用正则处理千分位分隔符的数字

/** 给数字增加或者去掉千分位分隔符 */
export function ThousandthInterRotation(num) {
  const r1 = /(\d)(?=(\d{3})+\.)/g;
  const r2 = /(\d)(?=(\d{3}))/g;
  if (num === undefined || num === null) return;
  const str = num.toString();
  if (str.includes(',')) {
    return str.replace(/,/g, '');
  }
  const r3 = str.includes('.') ? r1 : r2;
  return str.replace(r3, function ($0, $1) {
    return $1 + ',';
  });
}

深拷贝

/** 深拷贝 */
export function deepClone(obj) {
  let map = new Map(); // WeakMap
  function copy(obj) {
    let newobj = null;
    if (typeof obj == 'object' && obj !== null) {
      if (map.get(obj)) {
        newobj = map.get(obj); // 如果不想循环打印 可以设置为null
      } else {
        newobj = obj instanceof Array ? [] : {};
        map.set(obj, newobj);
        for (var i in obj) {
          newobj[i] = copy(obj[i]);
        }
      }
    } else {
      newobj = obj;
    }
    return newobj;
  }
  return copy(obj);
}

通过window.open打开一个居中的窗口

/** 通过window.open打开一个居中的窗口 */
export const openwindow = (url, name, iWidth, iHeight) => {
  var url; //转向网页的地址;
  var name; //网页名称，可为空;
  var iWidth; //弹出窗口的宽度;
  var iHeight; //弹出窗口的高度;
  //window.screen.height获得屏幕的高，window.screen.width获得屏幕的宽
  var iTop = (window.screen.height - 30 - iHeight) / 2; //获得窗口的垂直位置;
  var iLeft = (window.screen.width - 10 - iWidth) / 2; //获得窗口的水平位置;
  window.open(
    url,
    name,
    'height=' +
      iHeight +
      ',,innerHeight=' +
      iHeight +
      ',width=' +
      iWidth +
      ',innerWidth=' +
      iWidth +
      ',top=' +
      iTop +
      ',left=' +
      iLeft +
      ',toolbar=no,menubar=no,scrollbars=auto,resizeable=no,location=no,status=no',
  );
};

生成范围内的随机数

/** 随机数
 * @param min
 * @param max
 */
export function random(min, max) {
  return Math.floor(Math.random() * (max - min)) + min;
}

判断一个对象是否是数组，且有数据

export function isNotEmptyArray(arr) {
  return Array.isArray(arr) && arr.length > 0;
}

从TreeData中找出所有满足条件的item，返回一个list

/** TreeData查找List
 * @param fieldName 需要对比的字段名称默认是id
 * @param needFieldName 需要的字段名，如果没有，则返回整个item
 * @param childrenName children字段名称 默认是children
 * @param value 需要对比的值
 * @param condition 限制条件
 */
export function TreeDataFindList(
  { treeData = [], childrenName = 'children', needFieldName, condition } = {
    /** 需要寻找的数据来源，默认是[] */
    treeData: [],
    /** 需要对比的字段名称默认是id */
    // fieldName: 'id',
    /** children字段名称 默认是children */
    childrenName: 'children',
    /** 用来比较的值，默认是空字符串 */
    // value: '',
    needFieldName: '',
    condition: {
      // 1: {
      //   fieldName: "isUse",
      //   value: true,
      //   condition: "==="
      // },
      // 2: {
      //   fieldName: "children",
      //   value: false,
      //   condition: "isNotEmptyArray"
      // }
    },
  },
) {
  let item = [];
  const loop = (treeData) => {
    treeData.forEach((x) => {
      let flag = true;
      for (const key in condition) {
        const i = condition[key];
        switch (i['condition']) {
          case '===':
            flag = x[i['fieldName']] === i['value'];
            break;
          case 'isNotEmptyArray':
            flag = isNotEmptyArray(x[i['fieldName']]) === i['value'];
            break;

          default:
            break;
        }
        if (!flag) break;
      }
      if (flag) {
        if (needFieldName) {
          item.push(x[needFieldName]);
        } else {
          item.push(x);
        }
      }

      if (Array.isArray(x[childrenName]) && x[childrenName].length) {
        loop(x[childrenName]);
      }
    });
  };
  loop(treeData);
  if (item) return item;
  return null;
}

dataSource改变某一行的某一个字段

/** dataSource改变某一行的某个字段 */
export function changeData(
  { origin, fieldName, fieldValue, changeFildName, changeFildValue, childrenName = 'children' } = {
    /** 原始数据 数组或者treeData */
    origin: [],
    /** 作比较的字段名称 */
    fieldName: '',
    /** 作比较的字段值 */
    fieldValue: 'id',
    /** 要改变的字段名称 */
    changeFildName: '',
    /** 要改变的字段的值 */
    changeFildValue: '',
    /** children字段 */
    childrenName: 'children',
  },
) {
  (origin || []).forEach((x) => {
    if (x[fieldName] === fieldValue) {
      x[changeFildName] = changeFildValue;
    }
    if (Array.isArray(x[childrenName]) && x[childrenName].length) {
      changeData({
        origin: x[childrenName],
        fieldName,
        fieldValue,
        changeFildName,
        changeFildValue,
        childrenName,
      });
    }
  });
  return origin;
}

dataSource改变某一行

/** dataSource改变某行 */
export function changeDataRow(
  { origin, fieldName, rowData, childrenName = 'children' } = {
    /** 原始数据 数组或者treeData */
    origin: [],
    /** 做比较的字段名称 */
    fieldName,
    /** 需要替换的数据 */
    rowData: {},
    /** children字段 */
    childrenName: 'children',
  },
) {
  console.log('====================================');
  console.log('rowData', rowData);
  console.log('====================================');
  (origin || []).forEach((x, i) => {
    if (x[fieldName] === rowData[fieldName]) {
      origin[i] = rowData;
    }
    if (Array.isArray(x[childrenName]) && x[childrenName].length) {
      changeDataRow({
        origin: x[childrenName],
        fieldName,
        rowData,
        childrenName,
      });
    }
  });
  return origin;
}