element-plus组件问题汇总
一、el-select
1. 下拉选项实现添加全部
问题描述：value为空时，select框中不显示全部选项，但是下拉列表中全部显示是勾选状态
图片：
解决办法：添加 :empty-values="[null, undefined]" :value-on-clear="null"
javascript
复制代码
<el-select clearable v-model="formData.systemModule" placeholder="请选择" :empty-values="[null, undefined]" :value-on-clear="null" class="customSelect">
<el-option label="全部" value="" />
<el-option v-for="item in systemModuleOptions" :key="item" :label="item" :value="item" />
</el-select>
二、el-date-picker
1. 修改前缀图标
代码：
javascript
复制代码
// 模版中
<el-date-picker
v-model="formData.startTime"
type="date"
placeholder="选择日期时间"
:prefix-icon="customPrefix"
/>
// 方法
<script setup lang="ts">
import { ref, h, shallowRef } from "vue";
const customPrefix = shallowRef({
render() {
return h('span', { class: 'mayDateIcon' })
},
})
</script>
// 样式
::v-deep {
.mayDateIcon {
display: inline-block;
width: 17px;
height: 17px;
background: url(../../assets/images/date.png) no-repeat; // 替换的图片地址
background-size: 100% 100%;
}
}