前言
本篇文章主要记录我在开发中遇到的一些坑,为了加深记忆,我会把这些坑出现的原因和解决方案更新到这里,同时也希望这篇文章能够帮到正在遇到问题的你。
当然,一个问题不可能只有一个解决方案,如果你曾经遇到过相同的问题,并且拥有更多或更优雅的解决方案,欢迎在评论区分享。这篇文章我会一直更新维护下去,感兴趣的同学们可以狠狠的关注收藏一波啦!
一、elementUI表单重置功能,个别字段没有重置成功
- 查看
<el-form-item>中的prop属性是否填写正确 - 查看
resetFields方法是否在$nextTick中调用 - 查看
<el-col>标签中是否使用了v-if,需要去掉
二、js数字计算精度问题
// 加法
function numAdd(num1, num2) {
var r1,r2,m;
try{r1 = num1.toString().split('.')[1].length;}catch(e){r1 = 0;};
try{r2=num2.toString().split(".")[1].length;}catch(e){r2=0;};
m=Math.pow(10,Math.max(r1,r2));
return Math.round(num1*m+num2*m)/m;
}
// 减法
function numSub(num1,num2){
var r1,r2,m;
try{r1 = num1.toString().split('.')[1].length;}catch(e){r1 = 0;};
try{r2=num2.toString().split(".")[1].length;}catch(e){r2=0;};
m=Math.pow(10,Math.max(r1,r2));
n=(r1>=r2)?r1:r2;
return (Math.round(num1*m-num2*m)/m).toFixed(n);
}
// 乘法
function numMul(num1,num2){
var m=0,s1=num1.toString(),s2=num2.toString();
try{m+=s1.split(".")[1].length}catch(e){};
try{m+=s2.split(".")[1].length}catch(e){};
return Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m);
}
// 除法
function numDiv(num1,num2){
var t1,t2,r1,r2;
try{t1 = num1.toString().split('.')[1].length;}catch(e){t1 = 0;};
try{t2=num2.toString().split(".")[1].length;}catch(e){t2=0;};
r1=Number(num1.toString().replace(".",""));
r2=Number(num2.toString().replace(".",""));
return (r1/r2)*Math.pow(10,t2-t1);
}
三、elementUI表格自带排序错误问题
排序错误截图:
错误原因是elementUI自带的排序只对数字有效,由于展示的千分位金额是字符串,所以排序错误。解决办法就是使用sort-method属性指定值为数字的字段即可(如下)。
/*
* 字段yearAmount值是金额数字
* 字段yearAmountText值是千分位金额字符串
*/
<el-table-column
prop="yearAmountText"
sortable
:sort-method="(a, b) => {return a['yearAmount'] - b['yearAmount']}"
align="right"
label="本年"
/>
效果如下:
四、不同项目依赖的node版本不一样问题
使用node提供的n模块进行node版本管理,安装和使用方式如下:
// 安装n模块
sudo npm i -g n
// 下载并切换到指定node版本(如果已经下载过该版本,这个命令就是切换到该版本)
sudo n 16.20.0
// 查看已经下载过的node版本
n
// 查看当前node版本
node -v
// 删除指定node版本
sudo n rm 16.20.0
// 使用指定node版本运行命令
sudo n use 14.0.0 demo.js