写在开头上一篇文章 ElementUI源码系列三 - 学习gen-cssfile.js文件之自动创建组件的.scss文件与生成index.scss文件内容 我们讲过添加一个新组件要经历三个步骤：第一步 - 创建组件目录结构第二步 - 创建组件样式文件第三步 - 总入口文件引入组件并且我们实现了第二步的自动创建操作，也就是仅通过命令即可完成创建文件，再也不需要手动创建操作。当然，这第二步还不够高级，
转载
2024-07-03 23:13:10
48阅读
ElementUI 作为当前运用的最广的 Vue PC 端组件库，很多 Vue 组件库的架构都是参照 ElementUI 做的。作为一个有梦想的前端（咸鱼），当然需要好好学习一番这套比较成熟的架构。目录结构解析首先，我们先来看看 ElementUI 的目录结构，总体来说，ElementUI 的目录结构与 vue-cli2 相差不大：.github：存放贡献指南以及 issue、
转载
2024-06-01 06:43:55
100阅读
参与 Element3 开源项目，使用 TDD 的一些感受TDD的困惑很多项目团队并没有使用 TDD （测试驱动开发）的开发方式，我想这在目前的开发团队中占比非常高，特别是中小型公司的前端开发团队，几乎可以说是“全军覆没”，为什么？原因可能是以下所列的一些：TDD 太麻烦，增加了工作量TDD 太复杂，普通程序员掌握不了TDD 并不是必须的，不必要投入这些时间成本TDD 是个太理想的方式，还是要面对
转载
2024-10-22 12:41:21
33阅读
写在开头首先，如果你是从系列开头第一篇文章一篇一篇顺序看到这一篇文章，那么小编恭喜你，也感谢你，因为你足足读完了共一万字的文章，当然，也再次谢谢你对小编文章的喜爱，希望这系列文章对你能有一点微不足道的帮助，那我也心满意足了。O(∩_∩)O其次，前面写完了五篇文章，这是第六篇文章，而这一篇文章是一篇总结文，主要是总结一下前五篇文章学到的所有知识点，顺便也理理文章的思路，希望能对你有更进一步的帮助。最
源码如下：<template>
<div
class="el-switch"
:class="{ 'is-disabled': switchDisabled, 'is-checked': checked }"
role="switch"
:aria-checked="checked"
:aria-disabled="switchDisa
转载
2024-04-06 10:08:41
62阅读
提要 Vue2.0+Vuex+ElementUI是现在很多项目都在使用的BS软件的开发组合。 Vue相较于Angular具有学习成本低，上手快以及组件轻量化的特点；相较于React，其官方提供的很多指令以及可以自定义的指令能够为让开发更加高效。并且相较于React生命周期监听所有props和state的变化，Vue中提供的watch方法监听单个数据的变化，能够更加直观的进行数据操作。 需要修改源
转载
2024-04-28 20:45:44
428阅读
背景我司OA系统公文管理模块Office在线编辑使用的是金格IWebOffice中间件【PPAPI插件，通过<object>标签加载】，IWebOffice在chrome中设置div盒子的css样式display:none会造成控件的奔溃，出现空白等异常情况。用过ElementUI的都知道Tabs标签页，标签之间切换用的正是display属性，笔者要改的是使用width:0px;hei
转载
2024-04-08 21:26:12
91阅读
目录1.分类参数功能的开发1.创建分支2.参数管理概述3.通过路由将分类参数显示到页面中4.渲染分类参数基本结构5.获取商品分类的列表数据 6.获取商品分类的级联选择框7.控制其只能选中三级分类 8.渲染动态参数和静态属性的table标签9.渲染添加参数，添加属性的按钮（禁用和启用）10.获取参数列表数据问题1：面板切换了请求没有获取问题2：获取到的数据是给哪个面板使用12.渲
我的思路是：首先，只上传附件照片，这个直接看ele的官方例子就行，不仅仅上传附件照片，还同时上传其他参数。然后，再做上传照片和文件，上传其他参数，其实也就是文件合并。一、上传照片和其他参数页面样式大约就是这样的，参数有优先级，发生时间，服务单名称，服务单描述，图片附件上传。（一）视图部分代码：<el-form-item prop="image" label="图片附件上传"><e
一 分析vue2时期PC端的UI库封神之作elementUI随着vue3的到来,发布了其续作elementPlus,并在2022年发布正式版本(根据更新日志的信息,全新的稳定版2.0.0于2022-02-07发布).点这里一键跳转至官方网站.在elementPlus中,为了解决普通树形组件无法容纳大量数据的情况,提供了一款新的组件,来解决大量数据用树形组件展示问题,该组件便是我们今天要介绍的主角,
转载
2024-05-29 20:30:03
810阅读
ElementUi是怎么做表单验证的？在循环里对每个input验证怎么做呢？model 绑定表单数据,通过prop取表单数值,通过编写ref进行后台API验证 ,根据rules进行表单内容验证你有二次封装过ElementUI组件吗?popover + button 的组件，点击该按钮后还有个二次确认或选择的交互。 InfiniteScroll 封装个简单的带触底加载的列表<template&
花几天时间和小伙伴做了个仿知乎官网的项目，下面是我整理的项目搭建流程及部署和总结，如有不足之处欢迎大家批评指正！先奉上项目地址和源码！源码地址 ， 项目地址一、目录结构本项目使用vue-cli4脚手架创建，目录结构也比之前的2版本要简洁许多，下面是本项目的目录结构。 1.public文件夹下的data和found放的是json数据和图片资源，本来想直接调用知乎的数据接口，奈何没有权限，于是只好将j
目录开发环境实现效果技术要点及代码一、querySelectorAll() 方法二、scrollIntoView()方法实战核心代码开发环境在HBuilder X开发工具下通过CDN的方式引入vue2.0以及Element-UI<!--引入vue2.0-->
<script src="https://cdn.jsdelivr.net/npm/vue@2.7.10/dis
一、过渡 动画1.1简单的过渡动画使用parent.vue【0】定义一个待显示的数据 【1】定义一个显示隐藏flag 【2】使用动画过滤标签，name用来连接style样式；v-show用来控制数据显隐； 【3】按钮监听事件来控制data的flag为true,或false以控制视图的显隐 ；也可用函数来处理见methods里的sh函数 【4】可选，用来控制flag的true或false 【5】ht
转载
2024-10-10 14:48:50
291阅读
目录一、ElementUI 1.简介 : 2.安装 : 3.配置 : 4.使用 : 二、Axios
Vue Dhtmlxgantt甘特图/横道图 baselines 含（计划、实际时间对比）树形实例实现及部分扩展背景: 需满足计划、实际时间对比需求，本人查看了很多文档和资料（对比了dhtmlxgantt、jquery gantt、wl-gantt、Any Gantt、ganttView）【耗时近一周】，基本都是不太理想的，其中有一个wl-gantt（基于vue element-ui框架）可以使用
如果对您有一丁点的帮助，劳烦动动手指点个赞，您的支持和鼓励是搬砖人不断创作的动力！1、Vue 快速入门1.1、Vue的介绍Vue是一套构建用户界面的渐进式前端框架。只关注视图层，并且非常容易学习，还可以很方便的与其它库或已有项目整合。通过尽可能简单的API来实现响应数据的绑定和组合的视图组件。特点 易用：在有HTMLCSSJavaScript的基础上，快速上手。 灵活：简单小巧的核心，渐进式技术栈
转载
2024-10-19 09:06:29
224阅读
用过了elementUi的表单验证、表单提交之后，个人觉得不是太建议使用。第一：和我们自己写js的繁琐程度差不多，第二，还要读文档增加了学习时间和成本。 废话不多说，直接上代码html:注意1：代码中的：model顾名思义是我们双向绑定的数据，而ref=”user1”,我们可以把form表单看成是一个类，那么这个类的对象名字就是我们用ref指定的名字，这个名字会在js中调用elementUI的原
文章目录前言项目地址以及怎么阅读别人的代码整体代码分页数据作者是怎么处理的 usePagination顺藤摸瓜找到 api 接口的封装api 接口再往底层找全局请求封装与请求拦截器 service.ts 前言今天看一个 ts 项目的 table 模块，亲身体验这是公司后台管理系统一定会使用到的，也是最常使用到的，这个项目对新手很友好，毕竟是一个相对来说比较空的项目模板，对于我来说就是一个学习的记
转载
2024-09-27 15:45:35
51阅读
当我了解到Flex4那些对我诸多裨益的新特性后, 我便决定转而使用它。刚开始的时候，我试图利用在Flex前作中的认识和既有经验来快速进入状态。但很快我便发现有时即使面对一些显而易见的问题我也不得 不求助于API文档或者运行一些示例程序来弄清这种问题的来龙去脉。根据以往经验，Flex3 的Halo在处理显示列表的时候隐藏了大量的实现细节和不良设计。然而一旦你开始使用新的Spark架构后，你就得以近距
