Element-plus 中使用的一些常用方法、样式修改

334 阅读1分钟
1.时间日期选择(el-date-picker)开始时间结束日期交互;
// 开始时间
<el-data-picker :disabled-date="disabledDateStart" v-model="dataFrom.startTime" />
// 结束时间
<el-data-picker :disabled-date="disabledDate" v-model="dataFrom.startEnd" />
const disabledDateStart=(item:any)=>{
    if(dataFrom.value.endTime){
        return tiem.getTime() > new Date(dataFrom.value.startEnd).getTime();
    }
}
const disabledDate=(item:any)=>{
    return tiem.getTime() < new Date(dataFrom.value.startTime).getTime();
}
2.el-tree节点过滤不显示下级问题;
filterNode (value, data, node) {
    let parentNode = node.parent; // 父级node
    console.log("parentNode", parentNode.label);
    let labels = [node.label]; // 当前node的名字
    let level = 1; // 层级
    while (level < node.level) {
        labels = [...labels, parentNode.label]; // 当前node名字,父级node的名字
        parentNode = parentNode.parent;
        level++;
    }
    return labels.some((d) => d.indexOf(value) !== -1);
}

3.修改form表单、input默认填写账号密码背景颜色;
	::v-deep .el-input__inner {
		border: none;
		background-color: transparent !important;
	}
	::v-deep .el-input__inner:-webkit-autofill {
		-webkit-text-fill-color: #fff !important;
		transition: background-color 5000s ease-in-out 0s;
		caret-color: #fff !important; /*修改光标的颜色*/
	}