element-ui,是一款基于vue2.0的快速构建框架的前端组件。使用起来方便快捷,非常适合快速开发。但是,使用别人的通用组件有一个通病,那便是,做自己的项目常常会有自己的需求,是和组件组件本身相冲的。这时候的你就会陷入是无尽的烦恼中,如何既可以使用这个组件又可以达到自己想要的效果。这里我开设一个帖子,来记录我在项目开发中使用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. 使用Form表单时,Cannot read property 'resetFields' of undefined 问题

原因:mouted加载table数据以后,隐藏的弹出框并没有编译渲染进dom里面。

解决方法:

1、($nextTick dom下一次更新之后)

2、(如果是第一次就点击新增就没必要reset, 根据元素undefined判断)

3.使用el-dialog 遮罩层把显示内容遮住了

原因: Dialog 的外层布局的 position 值为 fixedabsoluterelative 三者之一时,就会出现被蒙板遮住的情况。

解决方法:

4.使用el-select 不能继承父元素的宽度

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

解决办法:给el-select 元素加行内 控制其宽度。

5.Upload文件上传

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

6.使用table表格自定义多选框时,@row-click@selection-change耦合

解决方法:

element-ui 使用时遇到的一些坑相关推荐

  1. Element UI 图片上传功能踩坑

     样式效果: <el-uploadmultipledragclass="upload-demo":headers="token"action=" ...

  2. Vue +vue-quill-editor+ Element UI使用富文本编辑器(后续更新上传视频、链接、表格....)

    如果你们有问题,可以发评论提问,我看见一定回复!!!!! 文章目录 一.基本使用 1.下载vue-quill-editor组件 2.引入· 富文本组件 3.工具栏相关配置 4.设置工具栏中文提示 5. ...

  3. elementui上传图片加参数_Vue + Element UI使用富文本编辑器

    第一步下载组件 npm install vue-quill-editor 第二步在需要使用的组件内引入· 富文本组件 import { quillEditor } from 'vue-quill-ed ...

  4. element ui html编辑器,Vue + Element UI使用富文本编辑器

    第一步下载组件 npm install vue-quill-editor 第二步在需要使用的组件内引入· 富文本组件 import { quillEditor } from 'vue-quill-ed ...

  5. element ui el-time-picker 时间选择其组件的坑点记录

    需求:需要进行一个时间区间的选择 遇到的问题:需要设置默认值,只需要拿到小时和分的时间格式. <el-time-pickeris-rangestyle="width:500px&quo ...

  6. Vue + Element UI 使用富文本编辑器

    第一步,先下载组件 npm install vue-quill-editor 第二步,在需要使用的位置引入(富文本组件) import { quillEditor } from 'vue-quill- ...

  7. Xcode 9使用时那些坑

    我目前使用Xcode9发现一些奇怪的坑,坑的不要不要的..... 1.本地图片怎么也不显示(新拖入的图片),如果之前的用xcode8开发的项目拖入的图片再用xcode9打开没有影响,但是在Xcode9 ...

  8. Vue安装element ui踩坑

    在vue安装element ui 的过程中报了许多错误,慢慢踩坑,希望能帮到各位 1.  输入  vue add element    输入 y y zh-CN 如果报错  ERROR  comman ...

  9. elementui 上传七牛_用element ui上传图片到七牛踩过的坑

    前端上传图片到七牛云的流程 请求后端接口获取上传凭证 请求七牛云地址上传图片到七牛云 上传完毕将获得七牛云返回的图片地址 七牛云地址 说到七牛云地址,奴家真的是一把鼻涕一把泪 刚开始做图片上传的时候, ...

最新文章

  1. 一款腾讯UED设计的提示插件(使用教程)
  2. 两大顶级AI算法一起开源!Nature、Science齐发Alphafold2相关重磅,双厨狂喜~
  3. linux 进程间 close-on-exec 机制 简介
  4. 数据中台离数据资产“价值变现”还有多远?
  5. SQLAlchemy 报错 NotSupportedError: Authentication plugin ‘caching_sha2_password’ is not supported 解决方法
  6. OpenLayers 官网例子的中文详解
  7. php html5 api,HTML5 File API解读
  8. xyz转ybc_三维弯管机交互式转档软件 (UG,SOLIDWORK,PRO/E文件转成YBC)
  9. HTML5中Head内标签详解(一):meta标签
  10. [cpp] 重载运算符规律总结
  11. python椭圆花瓣_Python抓取花瓣网高清美图
  12. 深入理解深度学习——Word Embedding(四):Skip-Gram模型的数学原理
  13. arcgis for android 调用公网天地图注记重影问题
  14. Excel文件的读取-xls格式篇
  15. RH358配置电子邮件传输--配置仅发送电子邮件服务
  16. IPA (苹果应用程序文件格式)
  17. 页面驱动开发(Page Driven) —— 一种大多数人还不认同的技术
  18. pytorch中num_workers详解
  19. 计算机基础和photoshop的应用,一级计算机基础与Photoshop应用真题
  20. 数据库的运算----选择,投影,连接

热门文章

  1. 中国钛金属粉末注射成型技术市场深度研究分析报告(2021)
  2. php imap 发送邮件,PHP IMAP解码消息
  3. 【信息检索】Java简易搜索引擎原理及实现(一)建立倒排索引
  4. 国产操作系统成了!装机量已超 3 亿台
  5. 移动热点服务的属性此计算机,win10移动热点提示:我们无法设置移动热点怎么办_win10显示无法设置移动热点怎么办...
  6. Ubuntu18.04系统搭建深度学习环境
  7. 计算机毕业设计springboot+vue基本微信小程序的家装公司管理系统小程序
  8. 安卓系统之旅——最全的Android源码目录结构
  9. Ubuntu系统 文件管理器打不开
  10. 展厅中控视频播放器,播放系统,udp/tcp/串口/语音/键盘协议控制!