vue + element 根据后台返回的数据显示对应的状态

  在项目中经常会有这样的需求，后端返回的数据是true或者false，前端在表格中显示成是或者否，正常或者异常
  
  重点代码：
  <template slot-scope="scope">
        <div v-if="col.dataIndex === 'lastOnOrOffStatus'">
          <span >{{scope.row[col.dataIndex] === "true" ? "开机" : "关机" }}</span>
        </div>
        <div v-else-if="col.dataIndex === 'sensorStatus'">
          <span >{{scope.row[col.dataIndex] === "true" ? "开机" : "关机" }}</span>
        </div>
        <span v-else>{{ scope.row[col.dataIndex] }}</span>
      </template>
      
  <template>
        <div>
        <el-table
        ref="multipleTable"
        :data="tableData"
        tooltip-effect="dark"
        style="width: 100%"
        :height="height"
        :row-style="{height:'20px'}"
        class="table-cls">
        <el-table-column prop="id" label="编号" type="index" width="60">
          <template slot-scope="scope">
            <span>{{(formInline.pageNo - 1) * formInline.pageSize + scope.$index + 1}}                     </span>
          </template>
        </el-table-column>
        <el-table-column
          v-for="(col,index) in tableColumns"
          :label="col.title"
          :prop="col.dataIndex"
          :key="index"
          :width="col.width?col.width:''"
          :align="col.align ? col.align : ''"
        >
          <template slot-scope="scope">
            <div v-if="col.dataIndex === 'lastOnOrOffStatus'">
              <span >{{scope.row[col.dataIndex] === "true" ? "开机" : "关机" }}</span>
            </div>
            <div v-else-if="col.dataIndex === 'sensorStatus'">
              <span >{{scope.row[col.dataIndex] === "true" ? "开机" : "关机" }}</span>
            </div>
            <span v-else>{{ scope.row[col.dataIndex] }}</span>
          </template>
        </el-table-column>
        </el-table>
        </div>
      </template>