1.0.15 • Published 2 years ago
ndx-npm-private v1.0.15
ndx-npm-private
一、说明和用法
PS:接下来每一个版本的md文档都会更新!!!!
1、本包连接GitHub
更新前请先上传到GitHub:https://github.com/ndx2527/ndx-npm-private.git
2、上传
# 版本更新
npm version patch
# 上传到npm
npm publish
3、使用方法
1)安装模块
npm i ndx-npm-private
2)按需导入模块
import { deepClone } from "ndx-npm-private";
const obj1 = {
name: "tom",
age: 20,
arr: [1, 2, 3, 4],
};
// 深度拷贝 obj1 ,使用的是自己封装的方法
const obj2 = deepClone(obj1);
obj2.name = "ndx";
console.log(obj1);
console.log(obj2);
4、扩展:修改源
查看源:npm config get registry
配置淘宝镜像源:npm config set registry https://registry.npm.taobao.org
配置官方源: npm config set registry https://registry.npmjs.org/
二、总览
- 深度拷贝:deepClone
- 计算时差:timeDiffer
- 时间戳转日期:formatDate
- 获取设备类型:getDeviceType
- 防抖:debounce
- 节流:throttle
- 金额转大写:digitUppercase
- 重置一个对象的所有key的值:resetObject
- URL解析:parseQueryString
三、详情
1、deepClone-深度克隆
说明:深度克隆一个对象或者数组。
参数:传入参数为一个对象/数组,返回一个深度克隆后的对象。
示例:
const obj1 = {
name: 'tom',
age: 20,
arr: [1, 2, 3, 4]
}
const obj2 = dealDate.deepClone(obj); // 返回深度克隆后的对象
2、timeDiffer-计算时差
说明:时间差值显为易读形式。
1.小于60s,显示刚刚
2.大于60s,小于1个小时,?分钟前
3.大于1小时,小于24小时,?小时前
4.大于24小时,小于一个月,?天前
5.大于一个月,小于12个月,?个月前
6.大于12个月,?年前
参数:第一个参数为过去时间,第二个参数为之后时间(不传默认为当前时间),参数是时间戳!
示例:
var t1 = new Date("2020-10-11 15:21:57");
var t2 = new Date(); // 获取当前时间
console.log(timediffer(t1, t2));
3、formatDate处理日期格式
说明:传入时间戳,可以转换成你想要的格式
用法:
/**
* @description: 时间戳转日期对象 默认当前日期
* @param {number} date 时间戳
* @param {string} pattern 时间格式
* @return {*}
*/
var time = new Date()
console.log(formatDate(time , 'yyyy-MM-dd hh:mm:ss')); // 2022-04-26 17:45:30
console.log(formatDate(time , 'yyyy-M-dd hh:mm')); // 2022-4-26 17:45
4、获取设备类型
说明:返回bool值,true移动端;反之PC端
/**
* @description: 获取设备类型
* @return { boolean } facility:true移动端;反之PC端
* @return {*}
*/
console.log(getDeviceType()); // true移动端;反之PC端
5、防抖
说明:一定时间内重复触发,仅执行最后一次操作,例如(搜索框)
/**
* 防抖原理:一定时间内,只有最后一次操作,再过wait毫秒后才执行函数
* @description: 防抖
* @param {Function} func 要执行的回调函数
* @param {Number} wait 延时的时间
* @return null
*/
// 使用示例
<template>
<div>
<el-button @click="printTest">按钮</el-button>
</div>
</template>
<script setup>
import { debounce } from "ndx-npm-private";
const printTest = () => {
console.log('1');
debounce(() => {
console.log("一定时间内,只有最后一次操作,再过wait毫秒后才执行函数");
}, 1000);
};
</script>
6、节流
说明:一定时间内多次触发仅执行一次。例如:抢票按钮
/**
* 节流原理:在一定时间内,只能触发一次
* @description: 节流
* @param {Function} func 要执行的回调函数
* @param {Number} wait 延时的时间
* @return null
*/
// 使用示例见防抖