vue2.0的Element UI的表格table列时间戳格式化

╰+攻爆jí腚メ 2022-06-04 04:08 189阅读 0赞

表格属性

\[html\]  [view plain][]  [copy][view plain]

1.  <el-table  
2.                  :data="tableData"  
3.                  v-loading.body="loading"  
4.                  border  
5.                  @selection-change="selectionChange"  
6.                  style="width: 100%">  
7.              <el-table-column  
8.                      prop="createTime"  
9.                      label="创建时间"  
10.                     :formatter="dateFormat"  
11.                     width="150">  
12.             </el-table-column>  
13.             <el-table-column  
14.                     prop="updateTime"  
15.                     label="更新时间"  
16.                     width="150">  
17.             </el-table-column>              
18.         </el-table>

script

\[javascript\]  [view plain][]  [copy][view plain]

1.  new Vue(\{  
2.          el: '\#tableView',  
3.          data: \{  
4.              //列表数据  
5.              tableData: \[\{  
6.              "createTime":1491559642000,  
7.              "updateTime":1491559642000  
8.              \}\],  
9.          \},  
10.         methods:\{  
11.             //时间格式化  
12.             dateFormat:function(row, column) \{  
13.                var date = row\[column.property\];  
14.           if (date == undefined) \{  
15.              return "";  
16.           \}  
17.           return moment(date).format("YYYY-MM-DD HH:mm:ss");  
18.             \}  
19.         \}  
20.     \});

简单来说，vue组件传入的方法函数应该使用v-bind属性绑定

时间格式化使用moent.js

[view plain]: http://blog.csdn.net/x_lord/article/details/70225481#