Element-ui可能遇到的问题(持续更新)

本文档列举了使用Element-ui框架时可能遇到的问题及其解决办法,包括日期时间的中文配置,日期时间格式化,表格数据高亮,循环表头,隐藏滚动组件,树形控件默认选中,固定表头样式问题,Tooltip与Tabs配合,表单验证,表格行删除等,并提供了相应的代码示例和解决方案。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

引入日期时间的时候遇到英文问题?

需要在main.js配置这句话:
import locale from “element-ui/lib/locale/lang/zh-CN”;
Vue.use(ElementUI, {locale})
表示全局配置element 多语言 组件。


选择完成的日期时间结果打印。

框架返回的时间是这样的:Fri Nov 10 2000 04:01:01 GMT+0800 (中国标准时间),可以通过以下方式转换成:2000-11-10 4:1:1
let Day = new Date(e[0]);
let Time=Day.getFullYear() +“-” +this.double(d.getMonth() + 1) + “-” +this.double(d.getDate()) + " " +this.double(d.getHours())+“:” +this.double(d.getMinutes()) +“:” +this.double(d.getSeconds());

double(num) {
if (num < 10) {
return “0” + num; //如果时分秒少于10,则在前面加字符串0
} else {
return “” + num; //否则,直接返回原有数字
}
}


根据条件高亮数据

在table标签上添加次函数 :row-class-name=“tableRowClassName”。
tableRowClassName({row, rowIndex}) {
if (row.money > 5000) {
return ‘money-row’
}
}
然后筛选条件返回一个类名。
:row-class-name 是在 td 上添加类名,还有 :cell-class-name 往 tr 上面加。


循环表头

在table表格中如果头部不固定可以这样写~

<el-table-column
  	 v-for="(item, i) in ClothesSize"
     :prop="item.prop"
     :key="i"
     :label="item.size"
     width="180">
</el-table-column>

在 ClothesSize 里面 size就是标题,prop 这个属性名是表示使用 table 里面的 :data=“tableDataClothes” 的数据。


隐藏的 el-scrollbar 组件

element中有个隐藏的组件官方并未给出文档,他是自带的一个自定义滚动组件,也是非常好用的~

<el-scrollbar wrap-class=&
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值