Element之formatter的使用

在Element的table组件中,具有formatter这一功能,对于表格字段的转换非常的方便。

示例如下:

<el-table-column
  key="beginTime"
  :formatter="dateFormat"
  show-overflow-tooltip
  prop="beginTime"
  label="报警时间"/>
<el-table-column
  key="duration"
  :formatter="textFormat"
  show-overflow-tooltip
  prop="duration"
  label="持续时长"/>

其中,dateFormat和textFormat是函数。

dateFormat(row, column, cellValue, index) {
  const daterc = row[column.property]
  if (daterc == null) {
    return '--'
  }
  var date = new Date(daterc)
  var y = date.getFullYear()
  var m = date.getMonth() + 1
  m = m < 10 ? ('0' + m) : m
  var d = date.getDate()
  d = d < 10 ? ('0' + d) : d
  var h = date.getHours()
  h = h < 10 ? ('0' + h) : h
  var minute = date.getMinutes()
  var second = date.getSeconds()
  minute = minute < 10 ? ('0' + minute) : minute
  second = second < 10 ? ('0' + second) : second
  return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second
},
textFormat(row, column, cellValue, index) {
  const val = row[column.property]
  if (val == null) {
    return '--'
  }
  return val
},

 

posted @ 2021-08-03 15:40  罗毅豪  阅读(2956)  评论(0编辑  收藏  举报