gan货大全

1.将excel文件中的日期格式的内容转回成标准时间

// 把excel文件中的日期格式的内容转回成标准时间
export function formatExcelDate(numb, format = '/') {
  const time = new Date((numb - 25567) * 24 * 3600000 - 5 * 60 * 1000 - 43 * 1000 - 24 * 3600000 - 8 * 3600000)
  time.setYear(time.getFullYear())
  const year = time.getFullYear() + ''
  const month = time.getMonth() + 1 + ''
  const date = time.getDate() + ''
  if (format && format.length === 1) {
    return year + format + month + format + date
  }
  return year + (month < 10 ? '0' + month : month) + (date < 10 ? '0' + date : date)
}

2.中文key转为英文key

后端需要的数据是这样的格式的 

[{'姓名'：'小张'， '手机号': '13712345678'}{.....}]

 我们需要将他转换为

[ {'username'：'小张'，'mobile': '13712345678'}, {.....} ]

思路：

1.定义一个数据对象 key是中文 value是英文  我们只需要对象[中文]就额可以拿到对象中的英 文value  例如 ：{username:"姓名"}

2.使用Object.keys拿到么一个数组中所有的key属性 ---中文key

3.使用map循环数组  数组里面有几项就转换成几个 返回的是一个数组  

4.在map定义空对象 之后循环中文key的每一项来处理每一个数据

5.给空对象的英文key进行赋值 数组里的每一项的中文key

代码如下

 format(result, header) {
      const mapInfo = {
        '入职日期': 'timeOfEntry',
        '手机号': 'mobile',
        '姓名': 'username',
        '转正日期': 'correctionTime',
        '工号': 'workNumber',
        '部门': 'departmentName',
        '聘用形式': 'formOfEmployment'
      }
       const arr = result.map(it => {
        const enobj = {}
        header.forEach(zhkey => {
          const enkey = mapInfo[zhkey]
          if (enkey === 'timeOfEntry' || enkey === 'correctionTime') {
            enobj[enkey] = new Date(formatExcelDate(it[zhkey]))
          } else {
            enobj[enkey] = it[zhkey]
          }
        })
        arr.push(enobj)
      })
      return arr
    },

3.英文key转化为中文key

  formatData(list) {
      const map = {
        'id': '编号',
        'password': '密码',
        'mobile': '手机号',
        'username': '姓名',
        'timeOfEntry': '入职日期',
        'formOfEmployment': '聘用形式',
        'correctionTime': '转正日期',
        'workNumber': '工号',
        'departmentName': '部门',
        'staffPhoto': '头像地址'
      }
      console.log(list)
      let header = []
      // header = ['id', 'mobile', 'username', .....]
      // data = [
      //     ['65c2', '1380000002', '管理员', ....],
      //     ['65c3', '1380000003', '孙财', ....],
      // ]
      let data = []
      // 开始代码
      // 找到一个元素
      const one = list[0]
      if (!one) {
        return { header, data }
      }
      header = Object.keys(one).map(key => {
        return map[key]
      })

      // data把list中每一个对象转成 对应的value数组
      data = list.map(obj1 => {
        // 把  Obj['formOfEmployment']: 1 , 2   ---> '正式'， '非正式'
        const key = obj1['formOfEmployment'] // 1, 2
        obj1['formOfEmployment'] = obj[key] // hireTypEnmu:{1:'正式', '2':'非正式' }

        return Object.values(obj1)
      })

      return { header, data }
    },

4.数组转换为树形

4-1递归形式实现

    <script>
            let arr=[
            { 'id': '29', 'pid': '',     'name': '总裁办' },
            { 'id': '2c', 'pid': '',     'name': '财务部' },
            { 'id': '2d', 'pid': '2c', 'name': '财务核算部'},
            { 'id': '2f', 'pid': '2c', 'name': '薪资管理部'},
            { 'id': 'd2', 'pid': '',     'name': '技术部'},
            { 'id': 'd3', 'pid': 'd2', 'name': 'Java研发部'}
            ]
         function tranListToTreeData(list,pid='') {
           // 先找到所有的根节点
           let tranList=list.filter(it=>it.pid===pid)
           tranList.forEach(itm =>{
            //传入id  list进行递归 在筛选出 他的父级 是一个数组
             itm.children=tranListToTreeData(list,itm.id)
           })
           return tranList
        }
        
        console.log(tranListToTreeData(arr));

4-2 非递归方式实现
 

// 数组转换为树形的函数

export function tranListToTreeData(list) {
  // 最终要产出的树状数据的数组
  const treeList = []
  // 所有项都使用对象存储起来
  const map = {}

  // 建立一个映射关系：通过id快速找到对应的元素
  list.forEach(item => {
    if (!item.children) {
      item.children = []
    }
    map[item.id] = item
  })
  // map:
  // {
  //   "312c": { 'id': '312c', 'pid': '',     'name': '财务部',    children: [{ 'id': '312d', 'pid': '312c', 'name': '财务核算部',children: []}] },
  //   "312d": { 'id': '312d', 'pid': '312c', 'name': '财务核算部',children: []}
  // }

  list.forEach(item => {
    // 对于每一个元素来说，先找它的上级
    //    如果能找到，说明它有上级，则要把它添加到上级的children中去
    //    如果找不到，说明它没有上级，直接添加到 treeList
    const parent = map[item.pid]
    // 如果存在则表示item不是最顶层的数据
    if (parent) {
      parent.children.push(item)
    } else {
      // 如果不存在 则是顶层数据
      treeList.push(item)
    }
  })
  // 返回出去
  return treeList
}

5.重置路由

export function resetRouter() {
  const newRouter = createRouter()
  router.matcher = newRouter.matcher // reset router
}

6.定时器（手机验证码、5秒跳转都适用）

import { useEffect, useRef, useState } from 'react'
export default function useCountDown (initCount = 10, callBack) {
  // 存入到useRef中
  const refTimer = useRef()
  /* 用户可以定义：
     1.倒计时的时间
     2.倒计时结束的动作
     3.何时开始倒计时
     */
  // 1. 初始化倒计时的时间
  const [count, setCount] = useState(initCount)
  // 2.开启定时器
  const start = () => {
    setCount(initCount)
    refTimer.current = setInterval(() => {
      setCount((count) => count - 1)
    }, 1000)
  }
  // 2.倒计时结束做的事情
  useEffect(
    () => {
      if (count === 0) {
        clearInterval(refTimer.current)
        callBack()
      }
    },
    [count]
  )
  // 3.组件销毁之前清掉定时器
  useEffect(() => {
    return () => {
      clearInterval(refTimer.current)
    }
  }, [])
  //  3.最后会返回给用户一个倒计时的时间和何时开始倒计时
  return {
    count,
    start
  }
}

5.axios的基础封装

import axios from 'axios'
// 配置全局基地址 和请求超时时间
const instance = axios.create({
  baseURL: 'http://geek.itheima.net/v1_0/',
  timeout: 5000
})

/**
 * 请求拦截器
 * 1.可以每次发请求之前携带请求头
 * **/
instance.interceptors.request.use(
  function (config) {
    return config
  },
  function (error) {
    return Promise.reject(error)
  }
)

/**
 * 请求拦截器
 * 1.axios每次返回的数据会多包裹一层对象 返回数据时我们可以直接在响应拦截器中将data return出去
 * 2.token失效可以进行处理，token失效在响应拦截器捕获错误 为401
 * 4.断网情况：response的值为undefined可以进行判断然后提示用户网络超时
 * **/
instance.interceptors.response.use(
  function (response) {
    return response.data
  },
  function (error) {
    return Promise.reject(error)
  }
)

export default instance

6.本地存入token，获取token等操作

const TOKEN = 'token'
// 1.获取token 传入token名
export const getToken = () => {
  return localStorage.getItem(TOKEN)
}

// 2.设置token 传入token名
export const setToken = (token) => {
  localStorage.setItem(TOKEN, token)
}

// 3.删除token
export const removeToken = () => {
  localStorage.removeItem(TOKEN)
}

// 4. 判断是否拥有token 返回一个布尔值
export const hasToken = () => {
  return !!getToken()
}