Element-ui一些坑（长期更新）

1.表格排序问题：采用远程排序，sortable必须为custom，否则会导致列表默认排序。

<el-table-column v-for="(item,index) in customList[0]" width="" :label="item.name" align="center" :property="item.field + '_sum'" :sortable="item.sort == 1? 'custom' : false">
  <template slot-scope="scope">
    <span>{{ scope.row[item.field] ?  scope.row[item.field] : scope.row[`${item.field}_sum`] }}</span>
  </template>
</el-table-column>

2.el-pagination页码问题：当page首次绑定值为1时，切换页面后返回，此时page数据更新为2但试图并未更新。

解决办法：采用v-if，list数据未回来，视图设置隐藏，list赋值成功后，视图设置显示。

<div class="page-center" v-if="pageShow">
  <el-pagination
    class="page-cotent"
    @size-change="handleSizeChange"
    @current-change="handleCurrentChange"
    :current-page.sync="listQuery.page"
    :page-sizes="[ 20, 50, 100, 500 ]"
    :page-size="listQuery.rows"
    :total="listTotal"
    hide-on-single-page
    layout="total, sizes, prev, pager, next, jumper">
  </el-pagination>
</div>

2.el抽屉打开自动聚焦问题。

解决办法：采用v-if。

watch: {
      templateIndex(val) {  //阻止抽屉出来，抽屉内自动聚焦问题
        this.$nextTick(()=> {
          this.tabShow = val? true : false
        })
      }
    },