vue element ui
我是顾昀峰
学习
展开
-
对element ui MessageBox弹框优化兼容移动端
MessageBox弹框兼容移动端的问题问题原因在上图中可以看到.el-message-box这个样式被定死为420px,因此会发生弹框位置不准确在移动端解决方案可以利用媒体查询@media实现在宽度小于750px一下,宽度可以使用百分比布局@media screen and (max-width: 750px) { .el-message-box { width: 60% !important; }}呈现效果...原创 2020-05-12 10:50:51 · 3118 阅读 · 7 评论 -
element ui 及时搜索防抖debounce研究探索
发现debounce参数在demo中通过ref获取el-cascader这个所有挂载到VueComponent上的参数,并发现debounce![在这里插入图片描述](https://img-blog.csdnimg.cn/20200507130922536.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10...原创 2020-05-07 17:25:24 · 5673 阅读 · 1 评论 -
element ui源码调试
资料element ui 源码地址:点击跳转第一步:如何调试element ui 源码npm run dev第二步:打包完成后可以根据localhost:8085 访问到源码的demo第三步:看到源码的界面第四步:调试的时候可以使用console.log() 或者alert打印内容,但不可以在代码里面加入debugger,加入之后会报错...原创 2020-05-07 12:50:13 · 4014 阅读 · 0 评论 -
element ui 图片自定义上传进度条消失问题
element ui 图片自定义上传进度条消失问题http-request自定义上传后出现的问题:(1)element ui自定义进度条会被禁止第一步:通过查找网上的资源后,发现axios请求的参数中使用 onUploadProgress事件下面的progressEvent可以监控到图片上传的进度第二步:需要引入element ui的进度条组件第三步:在data中注册percentag...原创 2019-05-06 10:39:37 · 5810 阅读 · 3 评论 -
element ui在style scoped的情况下,父组件的样式怎么修改子组件的样式
网上查询资料发现有三种方式:方法一:父组件可以外溢到子组件,但是同时会影响其他的组件方法二,方法三:都可以父组件单独影响子组件但是在实际操作过程中,我只有在尝试方案三的时候可以成功通过父组件影响子组件实际案例:父组件改变图片上传子组件效果图:...原创 2019-05-06 12:37:17 · 1541 阅读 · 0 评论 -
element ui图片上传-实现单图上传
业务需求,需要把多图上传的效果改造成为单图上传的效果效果展示原来官网效果https://element.eleme.cn/2.0/#/zh-CN/component/upload现在呈现的效果第一步:改造element ui upload的组件,value的值接收上传回来的图片路径,当value不存在的时候会显示图片上传插件第二步:当获得图片路径的时候,value有值得时候,显示该...原创 2019-05-06 13:19:50 · 13154 阅读 · 2 评论 -
element ui怎么结合阿里图标库
需求:因为element ui 图标库提供的图标比较少,因此需要引入图标库来弥补这一缺陷成果展示:第一步:阿里图标库链接:https://www.iconfont.cn/home/index?spm=a313x.7781069.1998910419.2点击购物车,注册新的项目,命名为test第二步:点击"下载至本地"第三步:将本地test文件夹中的icon放入vue cli脚手...原创 2019-05-06 14:10:32 · 515 阅读 · 0 评论 -
vue监听游览器关闭刷新事件
vue监听按钮事件参考资料链接:https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event成果图:google游览器刷新监听:关闭监听:IE 版本11以上关闭和刷新IE游览器:监听火狐关闭和刷新事件代码展示:...原创 2019-05-06 15:59:43 · 4000 阅读 · 0 评论 -
element ui table组件复用
怎么实现element ui中el-table的复用思路分析利用v-for来循环渲染加载el-table-column需要具备的知识点:(1)v-for循环(2) 父传子数据步骤一:先封装一个table可以引入到其他父组件中<!--table子组件封装--><template> <el-table :data="value.tableData" ...原创 2019-05-13 16:23:31 · 1546 阅读 · 0 评论