Element UI遇到的问题

最近手上做了新项目，框架使用Element UI框架，我以前使用Ant Design，遇到的一些问题，先一记下来。

1、table过长溢出使用省略号代替

使用show-overflow-tooltip属性搞定

<el-table-column prop="address" label="地址" width="150" :show-overflow-tooltip="true" />

2、table数据处理

Element UI提供了formatter属性，可以直接调用方法进行处理，相比而言，Ant Design需要使用插槽进行处理（要是我没记错的话）。

<el-table-column prop="status" label="状态" width="50"  :formatter="formatStatus" align="center" />

formatter方法可接受四个参数

formatStatus: function (row, column, cellValue, index) {
  if (cellValue === "0") {
    return '下线';
  } else if (cellValue === "1") {
    return '上线';
  } else {
    return '未知';
  }
}

3、多个el-dialog调用导致遮罩异常

使用modal-append-to-body属性来处理：遮罩层是否插入至 body 元素上，若为 false，则遮罩层会插入至 Dialog 的父元素上。

  <el-dialog title="列表" top="2vh" width="80%"
    :visible.sync="dialogVisible"
    :modal-append-to-body='false'></el-dialog>

未完待续...