elementui表格时间格式化
时间: 2023-09-07 22:13:28 浏览: 117
在 ElementUI 表格中,可以通过使用自定义的模板来格式化时间。以下是一个示例:
```html
<template>
<div>
<el-table :data="tableData">
<el-table-column prop="name" label="姓名"></el-table-column>
<el-table-column prop="date" label="日期">
<template slot-scope="scope">
{{ formatDate(scope.row.date) }}
</template>
</el-table-column>
</el-table>
</div>
</template>
<script>
export default {
data() {
return {
tableData: [
{ name: '张三', date: '2022-01-01' },
{ name: '李四', date: '2022-02-02' },
{ name: '王五', date: '2022-03-03' },
],
};
},
methods: {
formatDate(date) {
const options = { year: 'numeric', month: 'long', day: 'numeric' };
return new Date(date).toLocaleDateString('en-US', options);
},
},
};
</script>
```
在上面的示例中,我们使用了 `slot-scope` 来访问行数据,并通过 `formatDate` 方法来格式化日期。在 `formatDate` 方法中,我们可以使用 JavaScript 的内置 `Date` 对象和 `toLocaleDateString` 方法来格式化日期。你可以根据需求自定义时间格式。
希望这个示例对你有帮助!如果你有其他问题,请随时提问。
阅读全文