element-ui中的疑难杂症

element-ui table下方出现滚动条的情况

在使用element-ui table组件时，浏览器中出现了两条横向的滚动条，一条是浏览的自己的，一条是table的。table出现滚动条的原因是父元素的宽度不够，所以只要给父元素足够的宽度table的滚动条就会消失。

---

更改elementUI组件样式而不会影响到全局样式

使用scoped设置了样式作用域 可以去掉 如果还是影响
在外层容器添加唯一class，在style样式钱加上".容器class名"

---

多个table时要设定不同且唯一的row-key，否则多个table会混淆调用的api

---

el-table属性row-class-name用法及踩坑

需求前提：想要给表格的某一行加上不同的background，用来区分当前行的状态

使用后没有效果的问题！！！！！
第一步： 看看class有没有加上去
第二步： 如果class都加上去了也没有效果，看一下有没有使用stripe这个属性，这个属性是带斑马纹的表格样式，它和row-class-name共存时是没有效果的  
第三步：如果你也没有使用到stripe这个属性，那就要找样式的问题啦
使用scoped设置了样式作用域 ,这个会影响到class的样式
可以尝试使用/deep/深度选择器,必须在sass或less下

---

实现可输入的下拉框

• 使用allow-create属性即可通过在输入框中输入文字来创建新的条目
• 注意此时filterable必须为真
• 本例还使用了default-first-option属性，在该属性打开的情况下，按下回车就可以选中当前选项列表中的第一个选项，无需使用鼠标或键盘方向键进行定位

 

---

element UI默认选中table的第一行，高亮显示
 

  watch: {
    tableData: function() {
      this.$nextTick(function() {
        this.$refs.monthlyPlanTable.setCurrentRow(this.tableData[0])
      })
    }
  },