![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
elementUi
文章平均质量分 61
丹丹的小跟班
这个作者很懒,什么都没留下…
展开
-
设计可编辑表格组件
什么是表单表格呢?简单来说就是在一个表格里面进行表单操作,执行增删改查。这在一些后台管理系统中是尤为常见的。今天我们根据 + 来设计一个表单表格组件。(不涉及完整代码,想要使用完整功能可以看底部连接)首先我们思考表格里面的表单元素应该如何实现。在用户使用的时候,我们希望用户传入一个指定的类型自动去匹配对应的表单组件。那我们就应该将所有类型做一个集成,并分别给他们一个类型名称。当然,为了最大程度为他们保留在已经实现的属性与方法,肯定接收的是一个对象,对象里面包含了他要展示的组件类型,一些原的属性方法,我们原创 2023-12-14 13:06:08 · 705 阅读 · 1 评论 -
对el-select进行二次封装,解决数据量过大造成页面卡顿问题
解决select数据量过多造成的页面卡顿原创 2022-12-30 15:40:48 · 3811 阅读 · 5 评论 -
组件el-scrollbar的使用
对于elementui里面的scrollbar组件,一直没有一个清晰的使用方法,似乎每次使用需要的代码都不同,需要加各种乱七八糟的样式加穿透样式,今天自己测试了下,似乎并没有想象的复杂。1.最简单的使用<template> <div> <el-scrollbar> <div class="box"> <ul> <li v-for="item in 100">{{ item原创 2022-05-30 16:56:53 · 23747 阅读 · 2 评论 -
element里面的el-cascader组件宽度限制
element里面的el-cascader组件宽度会根据里面的数据自动延伸,也就导致了一下这种情况这个时候咋们可以直接设置他的最大宽度,就可以限制他的自由延伸.el-cascader-node { max-width: 250px;}这个语句不能写在scoped里面,会失效但是这也有一个新的问题,那就是有部分内容被遮挡,这个时候就需要我们的另一个组件上场了——el-tooltip咱们使用el-cascader里面的插槽,对文本直接进行处理,限制长度大于12就有内容提示。<el-原创 2022-05-10 16:24:35 · 9012 阅读 · 5 评论 -
vue2引用element2的两种方式
一.使用配套的element插件当你使用vue-cli3.0及以上创建项目时,element-ui其实是为其打造了一套专门的应用插件的,及其简单,无须过多操作,安装即可使用。1.按需引入组件当需要引用所有element组件时,只需要在你所创建的项目下,在同package.json文件的目录下打开控制台,输入vue add element即可。首先回提示你是否继续安装,直接回车即可(这一步是下载插件,如果不是第一次安装,有可能会没有该提示)? Still proceed? 下载完成后会询问你需原创 2022-04-28 18:07:40 · 2377 阅读 · 0 评论 -
element里面的表格单选操作
单选element表格原创 2021-12-30 17:30:07 · 1358 阅读 · 2 评论 -
element表单验证的简写
element表单校验的的方法validate相信都陌生。使用时,一般都是:submit() { this.$refs[refNames].validate(flag => { if(flag) { //通过校验,上传数据 } })}今天无意中遇到有前辈这么写:async submit() { await this.$refs[refNames].validate() //通过校验,上传数据}突然觉得代码十分清晰简洁,记录于此。...原创 2021-11-23 09:54:04 · 741 阅读 · 0 评论