🌈 介绍

基于 vue3.x + CompositionAPI setup 语法糖 + vite + element plus + vue-router-next + pinia 技术的后台开源免费模板，希望减少工作量，实现快速开发，此项目为 JS 非 TS 版本。

🏭 环境支持

Edge	Firefox	Chrome	Safari
Edge ≥ 88	Firefox ≥ 78	Chrome ≥ 87	Safari ≥ 13

由于 Vue3 不再支持 IE11，故而 ElementPlus 也不支持 IE11 及之前版本。

😉 hooks

依赖 ElementPlus，方法提示均使用 ElMessage

说明	方法	说明	使用
数据	useDeepClone	深度克隆	const result = useDeepClone(target) @param {Object} target：要克隆的目标 @return {Object} result：结果
存储	useLocalStorage	会话存储	useLocalStorage.set(key, value): 设置临时缓存 useLocalStorage.get(key): 获取临时缓存 useLocalStorage.remove(key): 移除临时缓存 useLocalStorage.clear(): 移除全部临时缓存 @param {String} key：设置缓存的名称 @param {Any} value：设置缓存的值
	useLocalStorage	本地存储	useLocalStorage.set(key, value): 设置临时缓存 useLocalStorage.get(key): 获取临时缓存 useLocalStorage.remove(key): 移除临时缓存 useLocalStorage.clear(): 移除全部临时缓存 @param {String} key：设置缓存的名称 @param {Any} value：设置缓存的值
函数	useDebounce	防抖	useDebounce(function, time) @param {Function} function：要处理防抖的函数 @param {String,Number} time：防抖的时间 @return {function}：防抖的函数
日期	useDateFormat	日期格式	useDateFormat(date, [format]) @param {Date} date：任何合法的时间格式、秒或毫秒的时间戳 @param {String} format：时间格式，可选，默认为 YYYY-mm-dd。 @return {String}：格式好的时间
验证	usePureNum	验证是否为纯数字	usePureNum(str) @param {String,Number} str：要验证的字符串或数字 @return {Boolean}：true / false
	usePhoneNum	验证是手机号	usePhoneNum(str) @param {String,Number} str：要验证的手机号 @return {Boolean}：true / false
	useEmailNum	验证是邮箱号	useEmailNum(str) @param {String} str：要验证的字符串 @return {Boolean}：true / false
	useEmptyObj	验证是空对象	useEmptyObj(obj) @param {Object} obj：要验证的对象 @return {Boolean}：true / false
	useDataType	检查数据类型	useDataType(data,[type]) @param {Any} data：数据 @param {Type}type：类型，可选值。 如果传了 type 会返回一个布尔值表示 data 是否与 type 类型相等 @return {String,Boolean}：数据类型或 true / false
样式	useCssVar	设置 css 变量	useCssVar(key, value) @param {String} key：要设置变量 @param {String} value：设置的值
	useRgbToHex	hex 颜色转 rgb 颜色	useRgbToHex(r, g, b) @param {String} r：红色 @param {String} g：绿色 @param {String} b：蓝色 @return {String}：Hex 值
	useHexToRgb	rgb 颜色转 Hex 颜色	useHexToRgb(str) @param {String} str：颜色值字符串 @return {String}：Rgb 值
	useDarkColor	加深颜色值	useDarkColor(color, level) @param {String} color：颜色值字符串 @param {String} level：加深的程度，限 0-1 之间 @return {String}：加深后的颜色
	useLightColor	变浅颜色值	useLightColor(color, level) @param {String} color：颜色值字符串 @param {String} level：变浅的程度，限 0-1 之间 @return {String}：变浅后的颜色
按键	useKeyStroke	键盘按下事件 注: 仅支持如下键 Esc、Tab、 BackSpace、Enter、Shift、Ctrl、 Alt、Up、Down、Left、Right	useKeyStroke(key, fun) @param {String} key：要监听的键 @param {Function} fun：回调函数
方法	useRepairZero	补零 ( 当数小于 10 在前补零 )	useRepairZero(number) @param {Number} number：当前数 @return {Number}：补零后的数

😊 指令

方法	说明	使用
v-isLogin	需要登录后可操作的函数	v-isLogin="fun"
v-throttle	节流函数指令	v-throttle:1000="fun"
v-size-ob	监控元素的尺寸变化	v-size-ob="fun"