【点赞收藏加关注，前端技术不迷路~】
一、校验工具及配置类
Vue.prototype.VTools = { ... }1.基础校验
【整数、百分数值、手机号、手机号脱敏、登录密码、身份证号（含合法校验）、身份证号、车牌号、邮箱地址】
/**
* 输入校验：整数
*/
checkInit: function (rule, value, callback) {
var ruleText = /^[1-9]\d*$|^[0]$/,
massageText=(rule.messageText?rule.messageText:'整数');
value=value?value.trim():value;
if (value === '') {
rule.beNull?callback():callback(new Error('请输入'+massageText));
} else if (!ruleText.test(value)) {
callback(new Error(massageText+'格式错误'));
} else {
callback();
}
},
/**
* 输入校验：百分数值
*/
checkRate: function (rule, value, callback) {
var ruleText = /^[1-9]\d*^|$[0]$/,
massageText=(rule.messageText?rule.messageText:'整数');
value=value?value.trim():value;
if (value === '') {
rule.beNull?callback():callback(new Error('请输入'+massageText));
} else if (!ruleText.test(value)) {
callback(new Error(massageText+'格式错误'));
} else {
callback();
}
},
/**
* 输入校验：手机号
*/
checkMobile: function (rule, value, callback) {
var ruleText = /^1[3|4|5|6|7|8|9]\d{9}$/,
massageText=(rule.messageText?rule.messageText:'手机号');
if (value === '' || value==undefined) {
rule.beNull?callback():callback(new Error('请输入'+massageText));
} else if (!ruleText.test(value)) {
callback(new Error(massageText+'格式错误'));
} else {
callback();
}
},
/**
* 输入校验：手机号脱敏
*/
checkMobileSafe: function (rule, value, callback) {
var ruleText = /^1[3|4|5|6|7|8|9]\d(\d{4}|\*{4})\d{4}$/,
massageText=(rule.messageText?rule.messageText:'手机号');
if (value === '' || value==undefined) {
rule.beNull?callback():callback(new Error(rule.inlineMessage?'必填':('请输入'+massageText)));
} else if (!ruleText.test(value)) {
callback(new Error(rule.inlineMessage?'格式错误':(massageText+'格式错误')));
} else {
callback();
}
},
/**
* 输入校验：登录密码检验大小写字母+数字
*/
checkPasswordHigh: function (rule, value, callback) {
var ruleText = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[a-zA-Z\d]{6,16}$/,
massageText=(rule.messageText?rule.messageText:'密码');
value=value?value.trim():value;
if (value === '') {
callback(new Error('请输入'+massageText));
} else if (!ruleText.test(value)) {
callback(new Error('格式错误:6-16位必须包含大小写字母、数字'));
} else {
callback();
}
},
/**
* 输入校验：身份证号（含合法校验）
*/
checkIdNo:function(rule, value, name, callback){
var n = name?name:'';
var k= value;
var pa = {};
var ereg = '';
k = k.toUpperCase();
var m = [true,
"您输入的" + n + "身份证号码位数不对!",
"您输入的" + n + "身份证号码错误",
"您输入的" + n + "身份证号码错误",
"您输入的" + n + "身份证号码错误",
"您输入的" + n + "身份证号码错误"];
var c = {
11: "\u5317\u4eac",
12: "\u5929\u6d25",
13: "\u6cb3\u5317",
14: "\u5c71\u897f",
15: "\u5185\u8499\u53e4",
21: "\u8fbd\u5b81",
22: "\u5409\u6797",
23: "\u9ed1\u9f99\u6c5f",
31: "\u4e0a\u6d77",
32: "\u6c5f\u82cf",
33: "\u6d59\u6c5f",
34: "\u5b89\u5fbd",
35: "\u798f\u5efa",
36: "\u6c5f\u897f",
37: "\u5c71\u4e1c",
41: "\u6cb3\u5357",
42: "\u6e56\u5317",
43: "\u6e56\u5357",
44: "\u5e7f\u4e1c",
45: "\u5e7f\u897f",
46: "\u6d77\u5357",
50: "\u91cd\u5e86",
51: "\u56db\u5ddd",
52: "\u8d35\u5dde",
53: "\u4e91\u5357",
54: "\u897f\u85cf",
61: "\u9655\u897f",
62: "\u7518\u8083",
63: "\u9752\u6d77",
64: "\u5b81\u590f",
65: "\u65b0\u7586",
71: "\u53f0\u6e7e",
81: "\u9999\u6e2f",
82: "\u6fb3\u95e8",
91: "\u56fd\u5916"
};
var b, l;
var e, j;
var a = new Array();
a = k.split("");
if (k == "") {
return true;
}
if (c[parseInt(k.substr(0, 2))] == null) {
return m[4];
}
switch (k.length) {
case 15:
if ((parseInt(k.substr(6, 2)) + 1900) % 4 == 0 || ((parseInt(k.substr(6, 2)) + 1900) % 100 == 0 && (parseInt(k.substr(6, 2)) + 1900) % 4 == 0)) {
ereg = /^[1-9][0-9]{5}[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|[1-2][0-9]))[0-9]{3}$/;
} else {
ereg = /^[1-9][0-9]{5}[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|1[0-9]|2[0-8]))[0-9]{3}$/;
}
if (ereg.test(k)) {
var o = k.substr(6, 2);
var f = k.substr(8, 2);
var n = k.substr(10, 2);
if (pa && pa.oServerDate) {
var g = pa.oServerDate;
} else {
var h = new Date();
var g = new Date(h.getFullYear(), h.getMonth(), h.getDate());
}
var d = new Date(o, parseInt(f, 10) - 1, n);
if ((Date.parse(d) - Date.parse(g)) >= 0) {
return m[5];
}
return m[0];
} else {
return m[2];
}
break;
case 18:
if (parseInt(k.substr(6, 4)) % 4 == 0 || (parseInt(k.substr(6, 4)) % 100 == 0 && parseInt(k.substr(6, 4)) % 4 == 0)) {
ereg = /^[1-9][0-9]{5}(19|20)[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|[1-2][0-9]))[0-9]{3}[0-9Xx]$/;
} else {
ereg = /^[1-9][0-9]{5}(19|20)[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|1[0-9]|2[0-8]))[0-9]{3}[0-9Xx]$/;
}
if (ereg.test(k)) {
e = (parseInt(a[0]) + parseInt(a[10])) * 7 + (parseInt(a[1]) + parseInt(a[11])) * 9 + (parseInt(a[2]) + parseInt(a[12])) * 10 + (parseInt(a[3]) + parseInt(a[13])) * 5 + (parseInt(a[4]) + parseInt(a[14])) * 8 + (parseInt(a[5]) + parseInt(a[15])) * 4 + (parseInt(a[6]) + parseInt(a[16])) * 2 + parseInt(a[7]) * 1 + parseInt(a[8]) * 6 + parseInt(a[9]) * 3;
b = e % 11;
j = "F";
l = "10X98765432";
j = l.substr(b, 1);
if (j == a[17]) {
var o = k.substr(6, 4);
var f = k.substr(10, 2);
var n = k.substr(12, 2);
if (pa && pa.oServerDate) {
var g = pa.oServerDate;
} else {
var h = new Date();
var g = new Date(h.getFullYear(), h.getMonth(), h.getDate());
}
var d = new Date(o, parseInt(f, 10) - 1, n);
if ((Date.parse(d) - Date.parse(g)) >= 0) {
return m[5];
}
return m[0];
} else {
return m[3];
}
} else {
return m[2];
}
break;
default:
return m[1];
break;
}
return true;
},
/**
*身份证号
*/
certiNo: function (rule, value, callback) {
let ruleText = /^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$|^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/,
massageText=(rule.messageText?rule.messageText:'证件号码');
if (value === '' || value==undefined) {
rule.beNull?callback():callback(new Error('请输入'+massageText));
} else if (!ruleText.test(value)) {
callback(new Error(massageText+'格式不正确'));
} else {
callback();
}
},
/**
* 输入校验：校验车牌号
*/
checkCarMark: function (rule, value, callback) {
let ruleText = /(^[\u4e00-\u9fa5][a-zA-Z][a-zA-Z0-9]{4}[a-zA-Z0-9\u4e00-\u9fa5]$)|(^[\u4e00-\u9fa5][a-zA-Z][DFA][a-zA-Z0-9]{5}$)|(^[\u4e00-\u9fa5]{1}[a-zA-Z]{1}\*$)/,
massageText=(rule.messageText?rule.messageText:'车牌号');
if (value === '' || value==undefined) {
rule.beNull?callback():callback(new Error(rule.inlineMessage?'必填':('请输入'+massageText)));
} else if (value.length!=7 && value.length!=8 && value.length!=3) {
callback(new Error(rule.inlineMessage?'格式错误':'请参照“京ABC123”或“京AD12345”格式填写车牌号'));
} else if (!ruleText.test(value)) {
callback(new Error(rule.inlineMessage?'格式错误':(value.length==8?'请参照“粤A[A/D/F]BC123”格式填写车牌号':'请参照“京ABC123”或“京AD12345”格式填写车牌号')));
} else {
callback();
}
},
/**
* 输入校验：邮箱地址
*/
email: function (rule, value, callback) {
let ruleText = /^[A-Za-z\d]+([-_.][A-Za-z\d]+)*@([A-Za-z\d]+[-.])+[A-Za-z\d]{2,4}$/,
massageText=(rule.messageText?rule.messageText:'邮箱地址');
if (value === '' || value==undefined) {
rule.beNull?callback():callback(new Error(rule.inlineMessage?'必填':('请输入'+massageText)));
} else if (!ruleText.test(value)) {
callback(new Error(rule.inlineMessage?'格式错误':(massageText+'格式不正确')));
} else {
callback();
}
},2.日期类配置
【点击同一日期、禁用日期（今日之前）、禁用日期（明日之前）】
/**
* 日期选择组件，点击同一日期如：2025-08-05，自动转成[2025-08-05, 2025-08-06]
* 使用：<el-date-picker :change="VTools.datePickerChange"/>
*/
datePickerChange (dateData) {
dateData && dateData[0] === dateData[1] && (dateData[1] = new Date(new Date(dateData[1]).setDate(new Date(dateData[1]).getDate() + 1)).Format("yyyy-MM-dd"));
},
/**
* 日期选择组件，只能选择今天之前的日期
* 使用：<el-date-picker :picker-options="VTools.dateBeforeToday"/>
*/
dateBeforeToday: {
disabledDate(time){
return time.getTime() > Date.now() - 8.64e6
}
},
/**
* 日期选择组件，只能选择明天之前的日期
* 使用：<el-date-picker :picker-options="VTools.dateBeforeTommorrow"/>
*/
dateBeforeTommorrow: {
disabledDate(time) {
return time.getTime() > Date.now();
},
},3.表格类配置
【金额格式化】
/**
* 表格金额格式化
* 使用：<el-table-column :formatter="VTools.toFix2"/>
*/
toFix2 (row,column,value) {
return value?Number(value).toFixed(2):0.00;
},二、全局工具
1.日期格式
/**
* 日期格式化工具
* format：将date格式日期按照pattern模板转成对应string格式日期
* parse：将string格式日期按照pattern模板转成对应date格式日期
*/
formatDate:{
format: function (date, pattern) {
pattern = pattern || DEFAULT_PATTERN;
return pattern.replace(SIGN_REGEXP, function ($0) {
switch ($0.charAt(0)) {
case 'y': return padding(date.getFullYear(), $0.length);
case 'M': return padding(date.getMonth() + 1, $0.length);
case 'd': return padding(date.getDate(), $0.length);
case 'w': return date.getDay() + 1;
case 'h': return padding(date.getHours(), $0.length);
case 'm': return padding(date.getMinutes(), $0.length);
case 's': return padding(date.getSeconds(), $0.length);
}
});
},
parse: function (dateString, pattern) {
var matchs1 = pattern.match(SIGN_REGEXP);
var matchs2 = dateString.match(/(\d)+/g);
if (matchs1.length == matchs2.length) {
var _date = new Date(1970, 0, 1);
for (var i = 0; i < matchs1.length; i++) {
var _int = parseInt(matchs2[i]);
var sign = matchs1[i];
switch (sign.charAt(0)) {
case 'y': _date.setFullYear(_int); break;
case 'M': _date.setMonth(_int - 1); break;
case 'd': _date.setDate(_int); break;
case 'h': _date.setHours(_int); break;
case 'm': _date.setMinutes(_int); break;
case 's': _date.setSeconds(_int); break;
}
}
return _date;
}
return null;
}
},2.对象空值操作
【去空值属性、去属性值无效空格】
/**
* 对象去除空值属性
*/
removeEmpty:function(data){
var result={};
for(var key in data){
if(data[key]!=''){
result[key]=data[key]
}
}
return result;
},
/**
* 对象属性值去除无效空格
*/
trimData:(data)=>{
let newData = {};
if (typeof data == "object" && data!=null){
if(data.length !=undefined){
newData = [];
}
for(let key in data){
if(typeof data[key] == 'string'){
newData[key] = data[key].replace(/(^\s*)|(\s*$)/g, "")
}else if(typeof data[key] == 'object'){
newData[key] = Vue.prototype.GTools.trimData(data[key]);
}else{
newData[key] = data[key];
}
}
}else{
newData = data;
}
return newData;
},3.金额格式化
【价格格式化、金额通用格式化】
/**
* 价格格式化->万元
*/
priceFormat:function(price){
if(!price) return;
var priceStr=price.toString();
if(priceStr.lastIndexOf(".")!=-1){
priceStr=priceStr.substr(0,priceStr.lastIndexOf("."));
}
var priceF;
if(priceStr.length>4){
priceF=priceStr.substring(0,(priceStr.length-4));
priceF+=(priceStr.slice(-4,-3)!=='0')?"."+priceStr.slice(-4,-3):'';
priceF+="万";
}else{
priceF=priceStr+"元";
}
return priceF;
},
/**
* 金额格式化方法
* 参数说明：（金额，是否含有两位小数，是否文本输出，是否更改单位）
*/
formatAmount:function(amount,noFloat,isLabel,changeUnit){
let label='';
let amountStr='';
typeof(amount) !='number' && (amount=parseFloat(amount));
if(changeUnit && amount>=999999999){
amount=(parseFloat(amount)/100000000<1?(parseFloat(amount)/100000000).toFixed(2):(parseFloat(amount)/100000000).toFixed(noFloat?0:2) );
label='亿';
}else if(changeUnit && amount>=99999){
amount=(parseFloat(amount)/10000<1?(parseFloat(amount)/10000).toFixed(2):(parseFloat(amount)/10000).toFixed(noFloat?0:2) );
label='万';
}else if(amount>0){
amount=(parseFloat(amount)<1?parseFloat(amount).toFixed(2):parseFloat(amount).toFixed(noFloat?0:2));
}
if(isLabel){
return label;
}else {
amount+=''
let amountArr1=amount.split('.')[0];
let amountArr2 ='';
if( !noFloat && amount.indexOf('.')>=0) {
amountArr2 = amount.split('.')[1];
}
while(amountArr1.length>3){
let tempStr=amountArr1.substring(0,amountArr1.length%3==0?3:amountArr1.length%3);
if(amountStr!=''){
amountStr+=',';
}
amountStr+=tempStr;
amountArr1=amountArr1.replace(tempStr,'');
}
if(amountStr!=''){
amountStr+=',';
}
amountStr+=amountArr1;
if(amountArr2){
amountStr+='.'+amountArr2;
}
return amountStr;
}
},
4.语音播报
/**
* 语音播报方法
*/
AudioPlayBystr(str_tip,onstartBack,onendBack,onpauseBack,onresumeBack,onerror){
var msg =new SpeechSynthesisUtterance();
msg.rate = 0.8; //播放语速
msg.pitch = 1; //音调高低
msg.text = str_tip;
msg.volume = 10 ;//播放音量
msg.lang="zh-CN";//语言类型
speechSynthesis.speak(msg);//播放
msg.onstart=function() {//开始播放
onstartBack && onstartBack();
};
msg.onend=function() {//播放完成
onendBack && onendBack();
};
msg.onpause=function() {//播放暂停
onpauseBack && onpauseBack();
};
msg.onresume=function() {//播放重新开始
onresumeBack && onresumeBack();
};
msg.onerror=function(error){//播放出现错误
onerror && onerror(error);
};
},三、内置对象原型方法扩展
1.Date
【指定格式化、日期格式化、时间格式化】
/**
* Date对象指定格式化：yyyy-MM-dd hh:mm:ss
*/
Date.prototype.Format = function (fmt) {
let 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 (let 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;
};
/**
* Date对象格式化：年-月-日
*/
Date.prototype.toLocalJSON = function () {
var day = this.getDate(),
month = this.getMonth() + 1,
year = this.getFullYear();
if (day < 10) {
day = "0" + day;
}
if (month < 10) {
month = "0" + month;
}
return year + "-" + month + "-" + day;
};
/**
* Date对象格式化：年-月-日 时:分:秒
*/
Date.prototype.toLocalJSONAll = function () {
var day = this.getDate(),
month = this.getMonth() + 1,
year = this.getFullYear(),
hour=this.getHours(),
minute=this.getMinutes(),
second=this.getSeconds();
if (day < 10) {
day = "0" + day;
}
if (month < 10) {
month = "0" + month;
}
if (hour < 10) {
hour = "0" + hour;
}
if (minute < 10) {
minute = "0" + minute;
}
if (second < 10) {
second = "0" + second;
}
return year + "-" + month + "-" + day + ' ' + hour + ':' + minute + ':' + second;
};
/**
* Date对象格式化：时:分:秒
*/
Date.prototype.toLocalJSONTime = function () {
var hour=this.getHours(),
minute=this.getMinutes(),
second=this.getSeconds();
if (hour < 10) {
hour = "0" + hour;
}
if (minute < 10) {
minute = "0" + minute;
}
if (second < 10) {
second = "0" + second;
}
return hour + ':' + minute + ':' + second;
};2.Vue
【notify提示、有效数据长度、自适应autoTable】
/**
* notify提示二次封装
*/
Vue.prototype._GMessage = ({message,type,duration}) => {
//如果需要提示不抵冲则注释掉下方closeAll，现先保持与message一样新的抵冲掉旧的
// Vue.prototype.$notify.closeAll();
Vue.prototype.$notify({
message: message || '',
type: type || 'info',
title: type == 'success'? '成功': type == 'error'? '失败' : '提示',
position: 'top-right',
duration: duration || 5500,
customClass: 'tcNotify'
});
};
/**
* 目标对象有效数据长度
*/
Vue.prototype._DataSize=(data)=>{
let result=0;
switch(typeof data){
case 'string':
result = data.length;
break;
case 'object':
result = data?Object.keys(data).length:0;
break;
case 'number':
case 'boolean':
result = 1;
break;
case 'undefined':
default :
result = 0;
break;
}
return result;
};
/**
* autoTable计算
* target说明：
* prop: 数据key
* 1abe1: 表头
* className: 列的 className
* too1tip: 是否鼠标具浮展示
* fixed: 是否浮动固定列
* tips: 提示信息
* align: 列对齐
* formatter: 数据格式化方法
* search: 是否过滤
* slot: 插槽
* forcesize: 固定宽度，通常与tooltip搭配使用
* sizeLimit: 最长宽度，通常与forceSize搭配使用
* meta: 业务自定义透传对象，key不能与上面重复
* 使用说明：
* 表头初始化：建议放在created中直接使用：
* this.listColumns = this._handleAutoColumns(this.sourceColumns, []);
* this.columns: el-table内 用template遍历el-table-column
* this.sourceColumns: 为表头配置信息
* <template v-for="columnObj in listColumns">
<el-table-column v-if="columnObj.fixed" :fixed="columnObj.fixed" :prop="columnObj.key" :label="columnObj.label" :width="columnObj.width?columnObj.width:100" :class-name="columnObj.className" :show-overflow-tooltip="columnObj.tooltip">
</el-table-column>
<el-table-column v-else-if="columnObj.key=='statusFormat'" :label="columnObj.label" :min-width="columnObj.width?columnObj.width:100" :class-name="columnObj.className" :show-overflow-tooltip="columnObj.tooltip">
<template slot-scope="scope" v-if="!scope.row.isEmpty">
<i class="fa fa-circle" :class="scope.row.status=='1'?'colorGreen':'colorRed'">{{scope.row.status=='1'?'有效':'无效'}}</i>
</template>
</el-table-column>
<el-table-column v-else-if="columnObj.key=='operateFormat'" fixed="right" :label="columnObj.label" :min-width="columnObj.width?columnObj.width:100" :class-name="columnObj.className" :show-overflow-tooltip="columnObj.tooltip">
<template slot-scope="scope" v-if="!scope.row.isEmpty">
<el-button size="mini" @click="handleEdit(scope.$index, scope.row)" style="margin-left:0;">查看/修改</el-button>
<!--<el-button v-if="userInfo.userInfo.isOrgAdmin=='1'" size="mini" @click="handleReset(scope.$index, scope.row)">重置密码</el-button>-->
<el-button type="danger" size="mini" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
</template>
</el-table-column>
<el-table-column v-else :prop="columnObj.key" :label="columnObj.label" :min-width="columnObj.width?columnObj.width:100" :class-name="columnObj.className" :show-overflow-tooltip="columnObj.tooltip">
</el-table-column>
</template>
*
* 表头根据数据动态调整：建议放在http请求回调中使用：
* this.listColumns = this._handleAutoColumns(this.sourceColumns, target);
*/
Vue.prototype._handleAutoColumns = (target, source) => {
return autoColumns(target,source);
}
function autoColumns(targetList, sourceData) {
const unitwidth = 14;
const exWidth = 22;
const result = [];
const specailExwidth = {};
targetList && targetList.forEach((temp) => {
const data = {
...(temp.meta || {}),
prop: temp.prop,
label: temp.label,
className: temp.className ? temp.className : '',
tooltip: temp.tooltip ? temp.tooltip : false,
fixed: temp.fixed ? temp.fixed : false,
tips: temp.tips ? temp.tips : '',
align: temp.align ? temp.align : '',
formatter: temp.formatter ? temp.formatter : null,
search: temp.search || null,
slot: temp.slot || '',
forcesize: temp.forcesize,
sortable: temp.sortable || false
}
if (temp.children && temp.children.length > 0) {
const subList = autoColumns(temp.children, sourceData);
data['children'] = subList;
result.push(data)
} else {
let maxsize = temp.defaultsize ? temp.defaultsize : 0;
if (!temp.forcesize || temp.sizeLimit) {
sourceData && sourceData.forEach((item) => {
const str = item[temp.prop] + '' ? item[temp.prop] + '' : '';
const substr = str ? str.replace(/[a-zA-Z\d\*\,\.\;\:\"\'\-\_\s]/g, '') : '';
const tempsize = Math.ceil(subStr.length * 0.55 + (str.length - subStr.length));
maxSize = Math.max(maxSize,tempSize);
});
temp.label && (maxsize = Math.max(maxSize, temp.label.length));
}
if (temp.sizeLimit) {
maxSize = Math.min(maxSize, temp.sizeLimit);
}
if (temp.fixed) {
data['fixed'] = temp.fixed;
}
data['width'] = Math.ceil(maxSize * unitwidth) + exwidth;
specailExWidth[temp.prop] && (data['width'] += specailExWidth[temp.prop]);
result.push(data);
}
});
return result;
}关于自适应autoTable的el-table的优化方案，【autoTable + 配置式开发 + 配置式模板】将在后续进行进一步讲解，敬请期待！
实用的全局方法是结合实际使用环境逐步迭代的，并且是需要结合实际环境进行针对性的具体实现调整。本帖子持续更新中...