项目简单常用插件


NPM包管理工具

提供各种插件下载

QS--(序列化)?

 	qs是一个增加了一些安全性的查询字符串解析和序列化字符串的库
#(1)安装与载入
	npm install qs
    import qs from 'qs’
#(2)简单方法
	`1` qs.parse()将URL解析成对象的形式
    `2` qs.stringify()是将对象 序列化成URL的形式,以&进行拼接
eg: 
	let str="page=1&&pageSize=10";
	console.log(qs.parse(str))
//控制台打印  {page:'1',pageSize:'10'}
	let str2={page:1,pageSize:10}
    console.log(qs.stringify(str2))
//控制台打印 page=1&pageSize=10

#(3)基本用途
	--`将传递参数序列化`--

moment--(时间处理)??

	处理时间插件
#(1)安装与载入
	npm i --save moment --->项目安装
	import moment from 'moment'
	import "moment/locale/zh-cn";//设置默认语言
	moment.locale("zh-cn");
	Vue.prototype.$moment = moment;

#(2)简单方法
	`1` moment().format("YYYY-MM-DD");//时间格式转换
	`2` moment().day();获取或设置星期几 星期日为 0、星期六为 6 (获取或设置week,month,year等同理)
 	`3` moment().quarter();获取或设置季度
    `4`	moment().add();通过增加时间来改变原始的 moment
    	eg:moment().add(7, 'days');增加七天 (days可简写d)
    `5` moment().subtract();通过减去时间来改变原始的 moment
    	eg:moment().subtract(8, 'months') 减去八个月
    `6` moment.locale();国际化 设置语言  
     ......   
#(3)基本用途
	--`日期格式`--
	--`时区`--
	--`设置时间`--
	--`语言转换 国际化`--
	--`相对时间`--

lodash--(封装函数,数组,对象的方法)?????

	是一个一致性、模块化、高性能的 JavaScript 实用工具库。内部封装非常多使用函数,操作数组操作对象的方法,Lodash 通过降低 array、number、objects、string 等等的使用难度从而让 JavaScript 变得更简单。
    官网:https://www.lodashjs.com/
#(1)安装与载入
	npm i -g npm --->全局安装
	npm i --save lodash --->项目安装
	`载入`
    node.js载入:
    	const _ = require('lodash');
	vue.js载入
		import _ from 'lodash';
		Vue.prototype._=_;

#(2)简单方法
	Array部分
	`1` _.chunk(array,size) 将数组(array)拆分成多个size长度的区块,不满size部分组成一个区
		eg:	_.chunk(['a', 'b', 'c', 'd'], 3);
		// 打印 [['a', 'b', 'c'], ['d']]

	`2` _.compact(array) 创建一个新数组,包含原数组中所有的非假值元素 (false,null,0,"", undefined和NaN都为假值)
       	eg:	_.compact([0, 1, false, 2, '', 3]);
        // 打印 [1, 2, 3]

	`3` _.concat(array, [values]) 创建一个新数组,将array与任何数组或值连接在一起
    	eg:var array = [1];
		   var other = _.concat(array, 2, [3], [[4]]);
		   console.log(other);
		   // 打印 [1, 2, 3, [4]]

    `4` _.uniq(array) 创建一个去重后的array数组
    	eg:_.uniq([2, 1, 2]);
		 // 打印 [2, 1]
	
	......
    
    function部分
    `1`_.debounce(func, waitTime) 创建一个 debounced(防抖动)函数 多次点击只取最后一次
    
    `2`_.throttle(func, waitTime) 创建一个节流函数,在 wait 秒内最多执行 func 一次的函数 一段时间内只触发一次
    
    ......
    
    object部分
	`1`_.get(object, path, defaultValue) 根据 object对象的path路径获取值。 如果解析 value 是 undefined 会以 defaultValue 取代
    eg:var object = { 'a': [{ 'b': { 'c': 3 } }] };
		_.get(object, 'a[0].b.c');
		// => 3
		_.get(object, ['a', '0', 'b', 'c']);
		// => 3
	.....
    
#(3)基本用途
	--`深拷贝 _.cloneDeep(obj)`--
	--`防抖和节流`--
	--`简化数组函数对象`--
	--`数值计算`--
	--`判断类型`--
	......