前端常见操作-持续更新

CSS常用的方法技巧： 

/*透明度兼容写法*/
{
    filter:alpha(opacity=50);   
    -moz-opacity:0.5;   
    -khtml-opacity: 0.5;   
    opacity: 0.5;  
}

/*滚动条*/
&::-webkit-scrollbar{width: 5px;height:5px;background-color:#ccc;}
/*定义滚动条轨道 内阴影+圆角*/
&::-webkit-scrollbar-track{background-color:#eee;}
/*定义滑块 内阴影+圆角*/
&::-webkit-scrollbar-thumb{background-color:#ccc;}
 

/*图标上下居中*/
i{display: inline-block; vertical-align: middle; margin-top: -2px;}


/*超出省略号1行*/
overflow: hidden;white-space: nowrap;text-overflow: ellipsis;


/*超出省略号2行*/
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;



/*ul列表前面加点*/
list-style: inside; color:#999;


/*图片居中显示*/
div.image{
	width:100%; height:152px; position: relative;
	img{
		position: absolute; top:0; left:0; right:0; bottom: 0; margin: auto;
		display: block; max-height:152px; max-width:100%; border-radius: 4px;
	}
}

常用写不出来的单词：

description：描述
avatar ：头像

版本问题：

//vue项目中使用sass，注意版本问题
cnpm i node-sass@4.14.1 cnpm i sass-loader@7.3.1 --save-dev

常用方法：

//清空对象里的每个属性的值
Object.keys(data.newData).forEach(key => data.newData[key] = '');

打包成war包  ：

建立：install.bat

例如： yarn test & cd dist & jar -cvf oabi.war *

说明：打包命令 & cd dist & jar -cvf  名称.war

ElementUi  el-date-picker大于当前年份置为 灰色 不可选

<!--
    大于当前年份置为 灰色 不可选
-->
<!--HTML部分-->
<el-date-picker
  type="year"
  placeholder="选择年份"
  format="YYYY"  
  value-format="YYYY"
   :disabled-date="disabledDate"
>
</el-date-picker>

<!--script部分-->

const disabledDate = (time) => {
  let currentMonth=new Date().getMonth()+1;
  if(currentMonth==1){
    let timeStamp = Date.now();
    timeStamp -= (365 * 24 * 60 * 60 * 1000);
    return time.getTime() > timeStamp
  }else{
    return time.getTime() > Date.now()
  }
}


<!--当前年月日之后不可选-->
const disabledDate=(time)=>{
   const currentDate = new Date();
   return time> currentDate;
}

ElementUi  el-date-picker  大于当前月份置为 灰色 不可选

<el-date-picker
   type="month"
   placeholder="选择月份"
   format="YYYY-MM"  
   value-format="YYYY-MM"
   :disabled-date="disabledMonth"
 />


const disabledMonth=(time)=>{
    let timestamp = Date.now();
    let dateObj = new Date(timestamp);
    dateObj.setMonth(dateObj.getMonth() - 1);
    return time.getTime() >= dateObj
}

人民币格式化

export const fixedToMoney=(value)=>{
    if (!value) return '--'
    var intPart = Number(value).toFixed(0) // 获取整数部分
    var intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') //将整数部分逢三一断
    var floatPart = '.00' //预定义小数部分
    var value2Array = value.toFixed(2).toString().split('.')
    // =2表示数据有小数位
    if (value2Array.length === 2) {
        floatPart = value2Array[1].toString() // 拿到小数部分
        if (floatPart.length === 1) {
            // 补0
            return intPartFormat + '.' + floatPart + '0'
        } else {
            return intPartFormat + '.' + floatPart
        }
    } else {
        return intPartFormat + floatPart
    }
}