Element 相关组件使用时遇到的一些坑点分享

Element 相关组件使用时遇到的一些坑点分享

element ui 相信很多使用vue开发的同学对它都不陌生，它使我们的前端开发变得更加简单，在此也非常感谢element的开发团队，但是也多多少少给我们的开发增加了些许痛点，坑点，在这里我分享几处我在开发中遇到的问题。

1、el-table树形数据，scope.$index问题

el-table中的树形数据，当表格是树形数据时，scope.$index的值子节点在部分浏览器中index是从父节点的index依次排下来的，如果在数据中操作行，只想以第一级树结构的index为数据操作项时，此时如果点击的是树子级数据，这个时候index的值就不会按照你想要的去走了，此时想对行进行操作时，就不要用表格中的scope.$index作为参数了，可以自行定义一个参数。

2、el-cascader使用动态数据需要加key

cascader中数据是通过接口请求，每次都有可能是不同数据时，需要在组件中动态的添加key值

<el-cascader
  ref="dictCascaderRef"
  placeholder
  :key="cascaderKey"
  :options="options"
  filterable
  :debounce="debounce"
  @change="getChange"
  @visible-change="visibleChange"
  :props="props"
></el-cascader>

cascaderKey在每次请求接口时动态增加

代码示例： 

data() {
  let that = this;
  return {
    cascaderKey: 1
  }
}

methods: {
  // 根据商品品类获取对应商品列表
  getCategoryGoods(val) {
    const param = {
      isActive: 1, 
      isNeedExtendAttr: false,
      isNeedImg: false, 
    };
    categoryGoodsFind(param)
      .then(res => {
        ++this.cascaderKey;
        ...
    }
  }

3、