Element UI 开发中遇到的问题和解决方案

1、tree组件中识别不了类似React的jsx语法

 解决方案：

下载以下包即可

npm install\
  babel-plugin-syntax-jsx\
  babel-plugin-transform-vue-jsx\
  babel-helper-vue-jsx-merge-props\
  --save-dev

下载完成后在'.babelrc' 添加即可

"plugins": ["transform-vue-jsx"],

2、el-tabs的使用

使用v-if控制tab标签显示遇到的Duplicate keys detected: 'xxx’问题

解决方案：

<el-tab-pane>中name属性值为xxx的key重复，可以对每一个el-tab-pane写入一个key值

el-tab-pane v-show无效

解决方案：

v-show起作用的本质是display:none,而因为td的display: table-cell;权限高于display:none,所以v-show失效

3、使用el-select 不能继承父元素的宽度 

原因：el-select 本身是  inline-block

解决方案：给el-select 元素加行内 控制其宽度。

4.Upload文件上传

解决方案：给<el-upload></el-upload>标签加上before-upload属性

5.使用table表格自定义多选框时，@row-click和@selection-change耦合
解决方案：