vue中使用element table，表格参数格式化form

element table formatter

解决办法：仔细看官网

element table formatter

template

<el-table
      :data="tableData"
      ref="singleTable"
      highlight-current-row
      style="width: 100%">
      <el-table-column
        type="index"
        :index = "indexMethod"
        width="50">
      </el-table-column>
      <el-table-column
        prop="date"
        label="日期"
        width="180"
        >
      </el-table-column>
      <el-table-column
        prop="sex"
        label="性别"
        width="180"
        :formatter="formatSex"
        >
      </el-table-column>
      <el-table-column
        prop="name"
        label="姓名"
        width="180">
      </el-table-column>
      <el-table-column
        prop="address"
        label="地址"
        width="180">
      </el-table-column>
      <!-- 渲染html的列 -->
      <el-table-column label="地址">
          <template slot-scope="scope">
              <div v-html="scope.row.address"></div>
          </template>
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button
            size="mini"
            @click="handleEdit(indexMethod(scope.$index), scope.row)">编辑</el-button>
          <el-button
            size="mini"
            type="danger"
            @click="handleDelete(indexMethod(scope.$index), scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>

data

tableData: [{
        myIndex: 6,
        date: '2016-05-02',
        name: '王小虎',
        address: '<i>上海市普陀区金沙江路 1518 弄</i>',
        sex: 0
      }, {
        myIndex: 7,
        date: '2016-05-04',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1517 弄',
        sex: 1
      }, {
        myIndex: 8,
        date: '2016-05-01',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1519 弄',
        sex: -1
      }, {
        myIndex: 9,
        date: '2016-05-03',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1516 弄',
        sex: 0
      }]

methods

formatSex: function (row, column) {
      return row.sex === 1 ? '男' : row.sex === 0 ? '女' : '未知'
}