elementui格式化时间
时间: 2023-10-04 12:08:12 浏览: 84
要在Element UI中格式化时间,你可以使用formatter属性。在Table组件中,你可以将formatter属性设置为一个函数,该函数接收当前行的数据作为参数,并返回格式化后的时间字符串。在这个函数中,你可以使用JavaScript内置的Date对象来对时间进行格式化。
例如,在Table组件的列定义中,你可以将formatter属性设置为一个函数,如下所示:
```javascript
<el-table-column prop="AuditEndTime" label="处理时间" width="120" :formatter="dateFormat" align="center"></el-table-column>
```
然后,在你的Vue实例中,你可以定义一个名为dateFormat的方法来实现时间格式化逻辑,如下所示:
```javascript
methods: {
dateFormat(row) {
const date = new Date(row.AuditEndTime); // 将数据中的时间字符串转换为Date对象
const year = date.getFullYear(); // 获取年份
const month = String(date.getMonth() + 1).padStart(2, "0"); // 获取月份,并补零
const day = String(date.getDate()).padStart(2, "0"); // 获取日期,并补零
const hours = String(date.getHours()).padStart(2, "0"); // 获取小时,并补零
const minutes = String(date.getMinutes()).padStart(2, "0"); // 获取分钟,并补零
const seconds = String(date.getSeconds()).padStart(2, "0"); // 获取秒数,并补零
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`; // 返回格式化后的时间字符串
}
}
```
这样,当Table组件渲染时,会自动调用dateFormat方法来格式化时间,并将格式化后的时间显示在处理时间列中。
请注意,在上面的例子中,我假设`row.AuditEndTime`是一个包含时间信息的字符串。如果你的数据中的时间字段是一个时间戳或其他类型的值,你需要根据实际情况进行相应的处理。
阅读全文