![](https://img-blog.csdnimg.cn/20201014180756738.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
elementUi
文章平均质量分 57
woowen!
这个作者很懒,什么都没留下…
展开
-
element UI修改组件的默认样式-转载
element UI修改组件的默认样式,方法有三种:新建global.css,并在main.js中引入import “./assets/style/global.css”; 在单个xx.vue文件最后多写一对标签,即有两对style标签,一对有scoped,一对没有scoped。如果写在有scoped属性的style标签里:覆盖的样式不会生效! 通过deep属性去控制,可以不用新建style标签,最方便通过这三种方法,在文件中编写css去覆盖原来的样式,可以通过添加 !important 修饰符提转载 2022-05-17 09:18:16 · 1661 阅读 · 0 评论 -
基础 Element-plus-vite-vue3
这里搭建一个基础的Element-plus-vite-vue3 项目作为练习记录,后续还会继续更新该篇文章加入一些其他功能。这里使用pnpm替代npm1. pnpm的安装:# 这里指定了pnpm的版本 7.0.0npm install -g pnpm@next-7# npm install -g pnpm注意⚠️:pnpm 安装需要Node.js版本 >= 14.19.02. 安装好后验证pnpm是否安装成功pnpm -v #7.0.0如果你...原创 2022-05-07 09:50:26 · 1106 阅读 · 1 评论 -
vue(vue/cli)+ElementUI 项目解决首屏加载慢的问题
目录1. 路由懒加载实现2. 按需引入ElementUI3.Gizp压缩4. 隐藏彩蛋:去除.map(.map起辅助调试作用)文件的生成,以加速生产环境的构建1. 路由懒加载实现点击查看路由懒加载的实现以及prefetch预加载问题2. 按需引入ElementUI查看官方文档按需引入值得注意的一点是,.babelrc文件的配置.babelrc遇到的问题在这里:1.vue项目启动报错提示:Support for the experimental syntax .原创 2021-12-21 09:36:11 · 1351 阅读 · 0 评论 -
vue 二次封装ElementUI table表格组件
el-table表格封装formatter:这个属性在列中如果使用插槽就会失效,所以我设置了两个列,如果有render方法说明单元格要内嵌代码,就是用特殊列,反之就是正常列,所以formatter和render不能同时使用...原创 2021-12-07 17:34:35 · 3833 阅读 · 0 评论 -
elementUI 关于上传组件的必传提示
思路:借助el-form表单校验 当文件上传成功后,el-upload组件中的“on-success”方法,在该方法中移除该表单项的校验结果clearValidate如图所示:代码如下:<templete> <div> <el-form :v-model="form" :rules="rules"> <el-form-item label="文件:" prop="files" ref="f...原创 2021-11-09 11:10:09 · 1800 阅读 · 0 评论 -
ElementUI el-tree 只可单选
<el-tree ref="menuTree" :data="menuTreeList" :check-strictly="true" show-checkbox node-key="id" highlight-current:filter-node-method="filterNode"@node-click="nodeClick" @check-change="handleCheckChange" default-expand-all/></el-tree&g..转载 2021-10-27 16:55:50 · 4235 阅读 · 0 评论 -
element-ui表格中复选框只能选中一个
el-table 表格,复选框只能单选一个转载 2021-10-26 18:08:02 · 1418 阅读 · 0 评论 -
elementUI Cascader 级联选择器 数据动态加载 及获取label值 以及数据回显问题
最近项目中有个需求是关于让用户选择发货地址和收货地址的需求大概样子长这样:后端接口要求将 label值 和 选择的省市区code码 都传给后端!!!1. 获取label值:<el-cascader ref="cascader" style="width:100%" v-model="form.endAddressCode" :props="options" @change="handleChange($event)"></el-cascader>le...原创 2021-10-20 10:38:08 · 4464 阅读 · 6 评论 -
el-tree 设置与上级严格关联、下级不严格关联
element-ui el-tree 设置与上级严格关联、下级不严格关联点击查看原文章应用场景:动态路由权限配置,菜单和按钮在一颗树内显示,要求按钮可以不被勾选(按钮一定为叶子节点),即叶子节点可以不严格关联此时我们的tree需要设置node-key、check-strictly为true,实现逻辑监听tree的check事件和treesetChecked方法tips:tree的数据(data)每级需要有上级的父节点id字段实现方法1.组建设置,如果返...转载 2021-05-21 18:13:20 · 1591 阅读 · 5 评论 -
vue结合elementUI实现tag多标签页
vue结合elementUI实现tag多标签页点击左侧菜单栏,会打开一个相应的tag标签页 点击tag标签可以在不同tag之间切换如图:以上图片的布局如下:<el-container> <BaseAside /> <el-main> <el-header> <AppTag /> </el-header> <el-mai原创 2020-12-26 23:06:06 · 15427 阅读 · 18 评论