常用的Code

随机16进制颜色

'#' + (~~(Math.random() * (1 << 24))).toString(16)

数字金额大于某个值增加逗号 类似:1,000,000

export const addCommas = (value) => {
  if (value && value.length > 0) {
    let val = value
    if (value >= 100000) {
      val = (value / 10000) + ''
      const nums = val.split('.')
      nums[0] = nums[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',')
      return nums.join('.')
    }
    return val.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',')
  }
  return value || '0'
}

字符串去除HTML标签

export const removeHtmltag = (str) => {
    return str.replace(/<[^>]+>/g, '')
}

下载文件

//根据url地址下载
export const download = (url) => {
    var isChrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;
    var isSafari = navigator.userAgent.toLowerCase().indexOf('safari') > -1;
    if (isChrome || isSafari) {
        var link = document.createElement('a');
        link.href = url;
        if (link.download !== undefined) {
            var fileName = url.substring(url.lastIndexOf('/') + 1, url.length);
            link.download = fileName;
        }
        if (document.createEvent) {
            var e = document.createEvent('MouseEvents');
            e.initEvent('click', true, true);
            link.dispatchEvent(e);
            return true;
        }
    }
    if (url.indexOf('?') === -1) {
        url += '?download';
    }
    window.open(url, '_self');
    return true;
}
// 使用fetch下载
export const downloadByFile = (url) => {
  return new Promise((resolve, reject) => {
    fetch(url)
      .then(response => response.blob())
      .then(blob => {
        if (blob.size > 0) {
          const href = window.URL.createObjectURL(new Blob([blob]))
          const a = document.createElement('a')
          a.style.display = 'none'
          a.href = href
          a.download = url.substring(url.lastIndexOf('/') + 1)
          document.body.appendChild(a)
          a.click()
          window.URL.revokeObjectURL(href)
          resolve('success')
        } else {
          reject('error')
        }
      })
      .catch(() => {
        reject('error')
      })
  })
}
//后端返回流
export const downloadByBlob = (content, name = 'fileName') => {
  return new Promise((resolve, reject) => {
    try {
      let type
      const suffix = name.replace(/^(.*\.)/g, '')
      if (suffix === 'xlsx') {
        type = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
      } else if (suffix === 'zip') {
        type = 'application/zip, application/octet-stream, application/x-zip-compressed, multipart/x-zip'
      } else if (suffix === 'docx') {
        type = 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'
      }
      const blob = new Blob([content], { type: type })
      const downloadElement = document.createElement('a')
      // 创建下载链接
      const href = window.URL.createObjectURL(blob)
      downloadElement.href = href
      // 下载文件名
      downloadElement.download = `${name}`
      document.body.appendChild(downloadElement)
      downloadElement.click()
      // 移除元素
      document.body.removeChild(downloadElement)
      // 释放blob对象
      window.URL.revokeObjectURL(href)
      resolve('success')
    } catch (error) {
      reject('error')
    }
  })
}

手机,邮箱,Url地址验证

//1.邮箱
export const isEmail = (s) => {
  return /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/.test(s)
}
// 2.手机号码
export const isMobile = (s) => {
  return /^1[0-9]{10}$/.test(s)
}
// 3.电话号码
export const isPhone = (s) => {
  return /^([0-9]{3,4}-)?[0-9]{7,8}$/.test(s)
}
//4.Url
export const isURL = (s) => {
  return /^http[s]?:\/\/.*/.test(s)
}

arraybuffer转json

export function arraybufferToJson(arrayBuffer) {
  try {
    const uint8Array = new Uint8Array(arrayBuffer)
    const decoder = new TextDecoder()
    const str = decoder.decode(uint8Array)
    const json = JSON.parse(str)
    return json
  } catch (error) {
    return { code: 0 }
  }
}

根据时间段 生成所有时间

// 根据时间段 生成所有时间
// 例如:generateDate('2023-01-01','2023-02-01')
export const generateDate = (start, end) => {
  var startDate = new Date(start.replace(/-/g, '/'))
  var endDate = new Date(end.replace(/-/g, '/'))
  const dates = []
  var currentDate = new Date(startDate)
  // eslint-disable-next-line no-unmodified-loop-condition
  while (currentDate <= endDate) {
    var dateString = currentDate.toLocaleDateString().slice(0, 10) // 获取日期字符串,格式为 YYYY-MM-DD
    const date = dateString.split('/')
    const year = date[0]
    const month = date[1].padStart(2, '0')
    const day = date[2].padStart(2, '0')
    dates.push(`${year}-${month}-${day}`)
    currentDate.setDate(currentDate.getDate() + 1) // 增加一天
  }
  return dates
}

js操作某个元素的class

//el是否包含某个class
export const hasClass = (el, className) => {
    let reg = new RegExp('(^|\\s)' + className + '(\\s|$)')
    return reg.test(el.className)
}
//el添加某个class
export const addClass = (el, className) => {
    if (hasClass(el, className)) {
        return
    }
    let newClass = el.className.split(' ')
    newClass.push(className)
    el.className = newClass.join(' ')
}
//el去除某个class
export const removeClass = (el, className) => {
    if (!hasClass(el, className)) {
        return
    }
    let reg = new RegExp('(^|\\s)' + className + '(\\s|$)', 'g')
    el.className = el.className.replace(reg, ' ')
}

js滚动事件

//获取滚动的坐标
export const getScrollPosition = (el = window) => ({
    x: el.pageXOffset !== undefined ? el.pageXOffset : el.scrollLeft,
    y: el.pageYOffset !== undefined ? el.pageYOffset : el.scrollTop
});
//滚动到顶部
export const scrollToTop = () => {
    const c = document.documentElement.scrollTop || document.body.scrollTop;
    if (c > 0) {
        window.requestAnimationFrame(scrollToTop);
        window.scrollTo(0, c - c / 8);
    }
}
//el是否在视口范围内
export const elementIsVisibleInViewport = (el, partiallyVisible = false) => {
    const { top, left, bottom, right } = el.getBoundingClientRect();
    const { innerHeight, innerWidth } = window;
    return partiallyVisible
        ? ((top > 0 && top < innerHeight) || (bottom > 0 && bottom < innerHeight)) &&
        ((left > 0 && left < innerWidth) || (right > 0 && right < innerWidth))
        : top >= 0 && left >= 0 && bottom <= innerHeight && right <= innerWidth;
}

判断终端

export const ua = navigator.userAgent.toLowerCase();

//19.是否是微信浏览器
export const isWeiXin = () => {
    return ua.match(/microMessenger/i) == 'micromessenger'
}
//20.是否是移动端
export const isDeviceMobile = () => {
    return /android|webos|iphone|ipod|balckberry/i.test(ua)
}
//21.是否是QQ浏览器
export const isQQBrowser = () => {
    return !!ua.match(/mqqbrowser|qzone|qqbrowser|qbwebviewtype/i)
}
//22.是否是爬虫
export const isSpider = () => {
    return /adsbot|googlebot|bingbot|msnbot|yandexbot|baidubot|robot|careerbot|seznambot|bot|baiduspider|jikespider|symantecspider|scannerlwebcrawler|crawler|360spider|sosospider|sogou web sprider|sogou orion spider/.test(ua)
}
//23.是否ios
export const isIos = () => {
    var u = navigator.userAgent;
    if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) {  //安卓手机
        return false
    } else if (u.indexOf('iPhone') > -1) {//苹果手机
        return true
    } else if (u.indexOf('iPad') > -1) {//iPad
        return false
    } else if (u.indexOf('Windows Phone') > -1) {//winphone手机
        return false
    } else {
        return false
    }
}
//24.是否为PC端
export const isPC = () => {
    var userAgentInfo = navigator.userAgent;
    var Agents = ["Android", "iPhone",
        "SymbianOS", "Windows Phone",
        "iPad", "iPod"];
    var flag = true;
    for (var v = 0; v < Agents.length; v++) {
        if (userAgentInfo.indexOf(Agents[v]) > 0) {
            flag = false;
            break;
        }
    }
    return flag;
}
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值