工作常用方法封装整理

暂且整理了部分 如有问题还请大神多多指教~~
1、截取链接参数:

  getUrlQueryString = (name) => {
	if (!name) {
      return ''
    }
    const url = location.href
    const reg = new RegExp(name + '=([^&]*)(|$)');
    if (!reg.test(url)) {
      return ''
    }
    return url.match(reg)[1]
  }

2、字符串截取:

userNameSubStr = str => {
	return str.length > 6 ? str.slice(0, 5) + '...' : str;
};

3、替换链接参数:

const replaceQueryString = (url, name, value) => {
	const re = new RegExp(name + '=[^&]*', 'gi')
    return url.replace(re, name + '=' + value)
}

4、map映射:

renderUserLevel(value) {
        var chargeTypeGroup = {
            "L0": "https://img.alicdn.com/imgextra/i4/O1CN01BNvdms1YLHV0RLgvg_!!6000000003042-2-tps-46-36.png",
            "L1": "https://img.alicdn.com/imgextra/i4/O1CN01Fz3OWP1kjo6FL2EPo_!!6000000004720-2-tps-42-36.png",
            "L2": "https://img.alicdn.com/imgextra/i4/O1CN01MHpSfo1erhE4qkEy1_!!6000000003925-2-tps-48-36.png",
            "L3": "https://img.alicdn.com/imgextra/i2/O1CN01SiRs3I1vcRVHQetYn_!!6000000006193-2-tps-48-36.png",
            "L4": "https://img.alicdn.com/imgextra/i2/O1CN01RE0nsX1xyXqeSIQKc_!!6000000006512-2-tps-46-36.png",
            "L5": "https://img.alicdn.com/imgextra/i1/O1CN01VVR2Jp25SV3sHmejK_!!6000000007525-2-tps-48-36.png",
            "L6": "https://img.alicdn.com/imgextra/i2/O1CN01krWCVK1IKKpV4mysA_!!6000000000874-2-tps-46-36.png"
        };
        return chargeTypeGroup[value];
    };

5、派发/监听事件:

let event = new CustomEvent('currentVideo', { "detail": (this.state.seriesCoursesList[0]) })
window.dispatchEvent(event)

window.addEventListener('currentVideo', (e) => {
	console.info(e.detail)
})

6、时间戳转日期格式(13位):

function timeago(dateTimeStamp) {
	let _dateTimeStamp = dateTimeStamp * 1
	let time = new Date(_dateTimeStamp);
	let y = time.getFullYear();
	let M = time.getMonth() + 1;
	M = M < 10 ? ('0' + M) : M;
	let d = time.getDate();
	d = d < 10 ? ('0' + d) : d;
	let h = time.getHours();
	h = h < 10 ? ('0' + h) : h;
	let m = time.getMinutes();
	m = m < 10 ? ('0' + m) : m;
	return y + '-' + M + '-' + d + ' ' + h + ':' + m;
}

7、千万位数转换

const numberConversion = (value) => {
    const newValue = ['', '', '']
    let fr = 1000
    let num = 3
    let text1 = ''
    let fm = 1
    while (value / fr >= 1) {
        fr *= 10
        num += 1
    }
    if (num <= 4) { // 千
        newValue[0] = value
    } else if (num <= 8) { // 万
        text1 = parseInt(num - 4) / 3 > 1 ? '千万' : 'W'
        fm = text1 === 'W' ? 10000 : 10000000
        if (value % fm === 0) {
            newValue[0] = parseInt(value / fm) + ''
        } else {
            newValue[0] = parseFloat(value / fm).toFixed(1) + ''
        }
        newValue[1] = text1
    } else if (num <= 16) { // 亿
        text1 = (num - 8) / 3 > 1 ? '千亿' : '亿'
        text1 = (num - 8) / 4 > 1 ? '万亿' : text1
        text1 = (num - 8) / 7 > 1 ? '千万亿' : text1
        fm = 1
        if (text1 === '亿') {
            fm = 100000000
        } else if (text1 === '千亿') {
            fm = 100000000000
        } else if (text1 === '万亿') {
            fm = 1000000000000
        } else if (text1 === '千万亿') {
            fm = 1000000000000000
        }
        if (value % fm === 0) {
            newValue[0] = parseInt(value / fm) + ''
        } else {
            newValue[0] = parseFloat(value / fm).toFixed(2) + ''
        }
        newValue[1] = text1
    }
    if (value < 1000) {
        newValue[0] = value + ''
        newValue[1] = ''
    }
    return newValue.join('')
}

8、节流:

//类组件写法 5s内只执行一次
lastTime = 0;
var nowTime = new Date().getTime();
if (nowTime - this.lastTime > 5000) {
	//do something
	this.lastTime = nowTime;
}

9、防抖:

const debounce = (fn, wait = 0) => {
    let that = this;
    if (typeof fn !== 'function') {
        throw new TypeError('Expected a function')
    }
    if (typeof wait !== 'number') {
        throw new TypeError('Expected a Number')
    }
    if (wait <= 0) {
        throw new TypeError('Expected a wait > 0')
    }

    let timer = null;
    return (args) => {
        if (timer) {
            clearInterval(timer);
            timer = null;
        };
        timer = setTimeout(() => {
            fn.call(that, args);
        }, wait);
    }
}

10、Axios:

import axios from 'axios';

const getRequest = async (url, params) => {
    return axios.get(url, {
        params,
        withCredentials: true,
    }).then(response => {
        const { success, errorMsg } = response.data;
        if (success) {
            return response
        } else {
            Message.error(errorMsg)
        }
    }).catch((error) => {
        console.log(error);
    });
};

getRequest(MOULD_DOWNLOAD_JSON, params).then((res) => { })

11、文案复制粘贴(移动):

const fallbackCopyTextToClipboard = (text) => {
    var textArea = document.createElement("textarea");
    textArea.value = text;

    // Avoid scrolling to bottom
    textArea.style.top = "0";
    textArea.style.left = "0";
    textArea.style.position = "fixed";

    document.body.appendChild(textArea);
    textArea.focus();
    textArea.select();

    try {
        var successful = document.execCommand('copy');
        var msg = successful ? 'successful' : 'unsuccessful';
        console.log('Fallback: Copying text command was ' + msg);
    } catch (err) {
        console.error('Fallback: Oops, unable to copy', err);
    }

    document.body.removeChild(textArea);
}
const copyTextToClipboard = (text) => {
    if (!navigator.clipboard) {
        fallbackCopyTextToClipboard(text);
        return;
    }
    navigator.clipboard.writeText(text).then(function () {
        console.log('Async: Copying to clipboard was successful!');
    }, function (err) {
        console.error('Async: Could not copy text: ', err);
    });
}

// copyTextToClipboard('复制文案')
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值