uniapp自用辅助类小记

环境HBuilder X +VUE3
记录一下，几个我用的顺手的辅助类。

1、配置 config.js

配置类，很容易实现开发、正式环境的路径切换

const CONFIG = {// 开发环境配置 服务器配置development: {assetsPath: '/static', // 静态资源路径baseUrl: 'http://localhost:6666/', // 后台接口请求地址dataUrl: 'http://localhost:6666/api', // 后台接口请求地址 hostUrl: '', // H5地址(前端运行地址)weixinAppId: '' ,// 微信公众号appidexpiretime:3600//1小时},// 生产环境配置 服务器配置production: {assetsPath: '/static', // 静态资源路径baseUrl: 'http://192.168.1.1:8080/', // 后台接口请求地址dataUrl: 'http://192.168.1.1:8080/api', // 后台接口请求地址hostUrl: '', // H5地址(前端运行地址)weixinAppId: '' ,// 微信公众号appidexpiretime:3600//1小时}
};
export default CONFIG[process.env.NODE_ENV];

2、请求request.js

/*request重写
调用
let obj={};
obj.Data = "[{\"str\":\"321\"},{\"str\":\"\"}]";
obj.DBstr = "123";
const params = {"object": "Data",//指向DataController "method": "GetTest",//指向方法"data": JSON.stringify(obj),}this.$request({data: params}).then((res) => {if (res.data == false) {} else {}}, err => {this.$mHelper.toast('请求失败');})}*/
import indexConfig from '@/common/config.js';
import assist from '@/common/assist.js';
const PATH = indexConfig.dataUrl;
const request = (options) => {let url=PATH+'/'+options.data.object+'/'+options.data.methodoptions=options.data;uni.showLoading({title: '加载中'});options.url=url;options.method= 'POST';options.header = {'content-type': 'application/json','authorization':'Bearer '+assist.gdata("Token")}return new Promise((resolve,reject) => {console.log(JSON.stringify(options));uni.request({...options,success: (res) => {console.log(res);console.log(res.statusCode);if(res.statusCode == '403') {// 登录过期跳转到登录界面uni.showToast({title: '超时，请稍后再试！',icon: 'none'});// logOut()}if(res.statusCode == '-1') {uni.showToast({title: res.data.msg ? res.data.msg : '接口请求失败！',icon: 'none'});}uni.hideLoading();resolve(res);},fail: (err) => {console.log(err);console.log(options);uni.hideLoading();reject(err)},})})
}
export default request

3、路由router.js

/*路由对象* 示例：this.navTo('/pages/home')navTo(url) {//console.log(url);this.$mRouter.push({route: url});},**/function constructor() {this.callBack = () => {};
}function beforeEach(callBack) {if (callBack instanceof Function) this.callBack = callBack;
}function push(to) {this.callBack('navigateTo', to);
}function redirectTo(to) {this.callBack('redirectTo', to);
}function reLaunch(to) {this.callBack('reLaunch', to);
}function switchTab(to) {this.callBack('switchTab', to);
}function back(delta) {// #ifdef H5history.back();// #endif// #ifndef H5uni.navigateBack({delta});// #endif
}export default {constructor:constructor,beforeEach:beforeEach,push: push,
}

要生效，需要先在main.js上 声明钩子

import $mRouter from '@/common/router.js';//路由重写
$mRouter.beforeEach((navType, to) => {uni[navType]({url: $assist.objParseUrlAndParam(to.route, to.query)});
});

4、辅助类

import config from '@/common/config.js';
const PATH = Config.baseUrl;
const expire = config.expire; //缓存过期时间
/*辅助脚本 *//*返回图片 服务器路径 */
function getimg(img) {return PATH + img;
}
/*数值两位小数 */
function unitConverter(num) {if (num) {num = num.toString().split("."); // 分隔小数点var arr = num[0].split("").reverse(); // 转换成字符数组并且倒序排列var res = [];for (var i = 0, len = arr.length; i < len; i++) {if (i % 3 === 0 && i !== 0) {res.push(","); // 添加分隔符}res.push(arr[i]);}res.reverse(); // 再次倒序成为正确的顺序if (num[1]) {if (num[1].length < 2) {// 如果有小数的话添加小数部分res = res.join("").concat("." + num[1] + '0');} else if (num[1].length > 2) {let data = num[1].substring(0, 2)// 如果有小数的话添加小数部分res = res.join("").concat("." + data);} else {res = res.join("").concat("." + num[1]);}} else {res = res.join("").concat("." + '00');}} else {res = '0.00'}return res;
}/*日期格式 */
function formatDate(str) {var now = new Date(parseInt(str.replace("/Date(", "").replace(")/", ""), 10));var year = now.getFullYear(); //取得4位数的年份var month = now.getMonth() + 1; //取得日期中的月份，其中0表示1月，11表示12月var date = now.getDate(); //返回日期月份中的天数（1到31）var hour = now.getHours(); //返回日期中的小时数（0到23）var minute = now.getMinutes(); //返回日期中的分钟数（0到59）var second = now.getSeconds(); //返回日期中的秒数（0到59）//return year + "-" + month + "-" + date + " " + hour + ":" + minute + ":" + second;return year + "-" + month + "-" + date;
}
/*日期格式 后缀 */
Date.prototype.Format = function(fmt) { //author: meizzvar o = {"M+": this.getMonth() + 1, //月份 "d+": this.getDate(), //日 "H+": this.getHours(), //小时 "m+": this.getMinutes(), //分 "s+": this.getSeconds(), //秒 "q+": Math.floor((this.getMonth() + 3) / 3), //季度 "S": this.getMilliseconds() //毫秒 };if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));for (var k in o)if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));return fmt;
}/*减法 防失精无限小数 */
function jian(arg2, arg1) {var r1, r2, m, n;try {r1 = arg1.toString().split(".")[1].length} catch (e) {r1 = 0}try {r2 = arg2.toString().split(".")[1].length} catch (e) {r2 = 0}m = Math.pow(10, Math.max(r1, r2));//lastmodifybydeeka  //动态控制精度长度  n = (r1 >= r2) ? r1 : r2;return ((arg2 * m - arg1 * m) / m).toFixed(n);
}/*加法 防失精无限小数 */
function jia(arg1, arg2) {var r1, r2, m;try {r1 = arg1.toString().split(".")[1].length} catch (e) {r1 = 0}try {r2 = arg2.toString().split(".")[1].length} catch (e) {r2 = 0}m = Math.pow(10, Math.max(r1, r2));return (arg1 * m + arg2 * m) / m;}
/*缓存写入*/
function  setCache(key, value, expire) {let obj = {data: value,time: Date.now()/1000,expire: expire}uni.setStorageSync(key, JSON.stringify(obj));
}
/*缓存读取*/
function  getCache(key, value, expire) {let val = uni.getStorageSync(key);if (!val) return null;let obj = JSON.parse(val);if (Date.now() / 1000 - obj.time > obj.expire)//过期{uni.removeStorageSync(key);return null;}return obj.data;
}
function objParseParam(obj){console.log("111："+obj);let paramStr="";if(obj instanceof Array) return paramStr;if(!(obj instanceof Object)) return paramStr;for(let key in obj){paramStr+=`${key}=${obj[key]}&`;	}return paramStr.substring(0,paramStr.length-1);
}
function objParseUrlAndParam(path,obj){console.log(path)let url=path||'/';let paramStr='';if(obj instanceof Array) return url;if(!(obj instanceof Object)) return url;paramStr=this.objParseParam(obj);console.log(paramStr)paramStr && (url+='?');url+=paramStr;return url;
}
function showMsg(msg){uni.showToast({title:msg,icon: 'none'});
}
function showYes(msg){uni.showToast({title:msg,icon: 'success',duration: 1000});
}
function showNo(msg){uni.showToast({title:msg,icon: 'error',duration: 1000});
}export default {getimg: getimg,unitConverter: unitConverter,jian: jian,jia: jia,formatDate: formatDate,sdata:setCache,gdata:getCache,objParseParam:objParseParam,objParseUrlAndParam:objParseUrlAndParam,showMsg:showMsg,showYes:showYes,showNo:showNo,
}

示例

//日期格式化
let datenow=New Date();
return  datenow.formatDate("yyyy-mm-dd");
//浮点计算，偶尔会出现无限未小数点
let a='0.0001'; let b='0.0002';
return  this.$assist.jia(a,b);  //0.0003
return this.$assist.jian(a,b);  //0.0001
//缓存
this.$assist.sdata("userName","张三")//赋值
this.$assist.sdata("userName",null)//清空
let  userName=this.$assist.gdata("userName")//读取
if(this.$assist.gdata("userName")==null)//判断
//提示
this.$assist.showYes("修改成功")
this.$assist.showYes("连接异常")
//图片名， 假设从数据库读取 赋值 aimg='/upload/1.png'
<img :src="$assist.getimg(aimg)">
//这样加上域名，方便测试环境和正式环境无缝连接。

5、全局申明 main.js

vue3

import App from './App'
import store from './store'
import {createSSRApp
} from 'vue'import $mConfig from '@/common/config.js'; //服务器配置
import $assist from '@/common/assist.js';//赋值函数
import $mRouter from '@/common/router.js';//路由重写
import $request from '@/common/request.js';//POST 重写
import scan from '@/components/scan/scan.vue'//扫描
//申明钩子
$mRouter.beforeEach((navType, to) => {uni[navType]({url: $assist.objParseUrlAndParam(to.route, to.query)});
});export function createApp() {const app = createSSRApp(App)app.use(store)app.config.globalProperties.$adpid = "1111111111"//脚本申明app.config.globalProperties.$mConfig = $mConfig;app.config.globalProperties.$assist = $assist;app.config.globalProperties.$mRouter = $mRouter;app.config.globalProperties.$request = $request;//组件申明app.component("scan",scan);//-endreturn {app}
}/*vue2 申明方法import Vue from 'vue'
//自定义
Vue.prototype.$mConfig = $mConfig;
Vue.prototype.$assist= $assist;
Vue.prototype.$mRouter = $mRouter;
Vue.prototype.$request = $request;
*/