在开发中,有时需要对后端返回的数据做处理后再显示在页面上,以element-ui官网的el-table示例,记录几个对表格内容做格式化的处理。
1.对表格内数据内容做格式化
如将日期格式显示为yyyy-mm
在el-table-column中添加formatter属性:
官方文档中是这样描述的:
我的demo代码如下:
<template>
<div class="about">
<h1>About Element UI Table</h1>
<el-table
:data="tableData"
style="width: 100%">
<el-table-column type="index">
</el-table-column>
<el-table-column
prop="date"
label="日期"
width="180"
:formatter="dateFormatter">
</el-table-column>
<el-table-column
prop="name"
label="姓名"
width="180">
</el-table-column>
<el-table-column
prop="address"
label="地址"