对于工作中用到的常用方法的封装总结

对于工作中用到的常用方法的封装总结

这些方法是为了解决项目中遇到的需求进行特定封装，所以适配性不会很高，但是可以在这些的基础上进行自己需求的相应调整，之后会不断更新

Tool.ts （Vue3 + TS）

/*
  响应式对象属性清空
 */
export function clearObjectValues(arg: any) {
  console.log('clear...')
  let object = JSON.parse(JSON.stringify(arg))
  if (isObject(object)) {
    for(let key in object) {
      if (isObject(object[key])) {
        clearObjectValues(object[key])
      } else if (isArray(object[key])) {
        arg[key] = []
      } else {
        arg[key] = null
      }
    }
  }
}

function isObject(obj) {
  return Object.prototype.toString.call(obj) === '[object Object]'
}

function isArray(arr) {
  return Object.prototype.toString.call(arr) === '[object Array]'
}

date.ts

/*
 * @Description: 关于时间的转换以及date-picker禁选时间的函数
 */

// 禁止选择今天之前的时间
export function beforeToday(date: Date) :boolean {
    let nowDate = new Date()
    let today = `${nowDate.getFullYear()}/${nowDate.getMonth() + 1}/${nowDate.getDate()}`
    let disabledDate = new Date(today)
    if(disabledDate <= date) {
        return true
    }
    return false
}

// 截取前十位 2011-10-12 00:00:00 -> 2011-10-12
export function spliceDate(date: string) :string {
    if (date.length > 10) {
        return date.substr(0, 10)
    }
    return date
}

export function SplicingDate(date:string, time:string, type?: string) :string {
    const myDate = spliceDate(date)
    if (type) {
        return `${myDate} ${ time ? time : '23:59'}`
    }
    return `${myDate} ${ time ? time : '00:00'}`
}

/*
 * @Description: 获取今天
 */

export function getNearDay(type?:string, dayNumber?: number) :string {
    let day = new Date()
    if (dayNumber) {
        dayNumber = type === 'B' ? -dayNumber : dayNumber
    } else {
        dayNumber = 0
    }
    day.setTime(day.getTime() + dayNumber * 24 * 60 * 60 * 1000)
    return `${day.getFullYear()}-${day.getMonth() + 1}-${day.getDate()}`
}

/*
 * @Description: date 格式转为 YYYY-MM-DD
 */
export function formatDate(date) :string {
    let day = new Date(date)
    day.setTime(day.getTime())
    let month = day.getMonth() + 1 < 10 ? '0' + (day.getMonth() + 1) : day.getMonth() + 1
    let dayday = day.getDate() < 10 ? '0' + day.getDate() : day.getDate()
    return `${day.getFullYear()}-${month}-${dayday}`
}

vue 路由问题

问题描述： 一个仓库中含有三个项目，打包发布之后通过不同的url上下文访问不同的项目，当其中一个项目刷新时会出现空白页现象

问题原因：该项目使用了history路由模式

解决办法：将history模式改为hash模式

const createRouter = () => new Router({
  mode: 'hash', // 修改该参数配置路由模式
  base: process.env.BASE_URL,
  scrollBehavior: () => ({ y: 0 }),
  routes: constantRoutes
})

vue 模拟鼠标点击

场景：点击某个dom元素触发其他dom或者组件的点击事件（有时候组件不会暴露它自身的click事件）

const e = document.createEvent("MouseEvents");
e.initEvent("click", true, true);
document.querySelector(`.ref${index}`).dispatchEvent(e);

webpack配置问题

vue 2项目中没有vueconfig配置文件，相关的webpack的配置文件可以放在根目录下的build文件夹

blog.csdn.net/luwenze/art…

将png图片转为.ico格式

在线转换网站：convertio.co/zh/png-ico/