前端开发始终绕不过的就是操作DOM，在Vue，Angular，React等框架出现后，我们通过操作数据来控制DOM（绝大多数时候），越来越少的去直接操作DOM。但是并不是所有时候都一定要引入这些库，对于基础的JS操作DOM的方法，还是需要掌握的。一、查询1.按照ID查询document.getElementById(id) // 兼容最好这个接口很简单，根据元素id返回元素，返回值是Element
转载
2024-09-23 10:30:09
61阅读
作者： 负雪明烛目录题目描述题目大意解题方法方法一：数组保存中序遍历结果方法二：只保存第 k 个节点迭代总结日期题目地址：https://leetcode.com/problems/kth-smallest-element-in-a-bst/#/description题目描述Given a binary search tree, write a function kthSmallest to fi
文章目录前言脚手架技术栈简介vue3TypeScriptPiniaTailwind CSSElement Plusvite详细步骤Node.js安装创建以 typescript 开发的vue3工程集成Pinia安装pinia修改main.ts创建一个store在组件中使用store集成Tailwind CSS安装postcss、sass、autoprefixer和tailwindcss以及相关依
查看报告功能的开发去element组件里找到Dialog对话框的嵌套的Dialog，对于确实需要嵌套Dialog的场景，我们提供了append-to-body属性，将内层Dialog的该属性设置为true，它就会插入至body元素上，从而保证内外层Dialog和遮罩层级关系的正确，复制一个div，id=report，新增的代码如下图：两层dialog定义完之后，要在内部的dialog里填充内容了，
转载
2024-05-07 16:47:46
370阅读
由于公司邮件系统是基于element ui写的，现在需求要写一个换肤功能，经过多次百度参考，予以完成，记录下来以供参考。基于element ui 的换肤功能前言：
我们要对css文件的所有选择器添加命名空间
如我们给所有的加上.custom-1b1e24
原css文件：
.header{height:100px;}
.content{color:#fff;}
=>输出
.custom-1b1
转载
2024-05-10 18:39:35
51阅读
先说环境吧：vue 3.2.45，也试过vue 3.2.16vue的scoped样式隔离原理：在当前组件的.vue文件中，如果style标签加了scoped属性，那么在组件渲染为DOM时，会对每个组件中的DOM元素添加格式为：data-v-[hash:8]的属性，然后该组件的所有`选择器`也会添加上对应的`[data-v-[hash:8]]`属性选择器来只对自身组件产生影响。以此来实现样式隔离。例
转载
2024-09-03 12:55:09
415阅读
1.什么是scoped在Vue文件中的style标签上有一个特殊的属性，scoped。当一个style标签拥有scoped属性时候，它的css样式只能用于当前的Vue组件，可以使组件的样式不相互污染。如果一个项目的所有style标签都加上了scoped属性，相当于实现了样式的模块化。2.scoped的实现原理Vue中的scoped属性的效果主要是通过PostCss实现的。以下是转译前的代码:<
我们在系统地学习如何开发前端的SPA项目时，在搭建完脚手架之后，不得不绕开的一个框架那就是UI库。UI库是一套集成的前端页面UI组件，可以帮助开发者更好地搭建美观的网站，缩短开发周期。我最近花了很长时间整理了Element-ui库的源码架构细节，下面通过这篇长文分段分享给大家系统架构我们首先从README.md这个markdown文档中： README.md 可以得出：elem
转载
2024-03-10 10:24:32
121阅读
文章目录一、 效果展示二、实现方法1、 表头可理解为三部分： `left`， `center` ，`right`2、 `left` 部分3、 `center` 部分4、 `right` 部分和 `left` 相似处理。5、 动态设置 rowspan （解决图层覆盖问题）三、完整实例代码1、 Html 做多层嵌套2、 数据模拟&图层覆盖问题四、为什么嵌套多层`<el-table-co
转载
2024-03-25 10:34:20
2626阅读
效果图首先是表头的处理部分<template slot-scope="scope">
<el-table-column align="center">
<template slot="header" slot-scope="scope">
{{ name }}交接班统计
转载
2024-03-15 09:59:02
1491阅读
一、更换主题颜色：通过颜色选择器来更换主题颜色： 首先封装一个颜色选择器选择颜色更换主题颜色的按钮：<template>
<el-color-picker
class="theme-picker"
popper-class="theme-picker-dropdown"
v-model="theme"
:size="size"
>
转载
2024-04-25 18:14:36
459阅读
入职快半个月。公司业务也多多少少了解，期间的任务也不多，工作安排也不是很理想。在这首先感谢一下我的组长，帮我解决了很多问题。也是组长带我到现在，再次感谢。公司在做iPad端应用，我上手时项目已经开发一半，技术用到vue+element UI。前面说到效果，各个功能实现，这几个功能也磨上了快半个月，之前并没有接触过element UI,以为那就是复制粘贴的事，其实并没有，还有很多细节方面的事需要自己
转载
2024-06-28 06:29:24
67阅读
elment-ui框架中excel导出存在封装方法，但如果要去修改excel文件样式，还需要修改框架源代码，并且也存在自定义字段需要导出时，使用框架中自带导出方法，无法满足其需求，因此针对上述两点，我在elment-ui框架基础上自己重新写了excel生成的方法，希望能帮助到有同样需求的小伙伴。1.Vue前台代码<i class="el-icon-download" @click="han
转载
2024-04-09 11:35:32
448阅读
需求:在开发中会遇到很多表格嵌套表格的使用,一个父级表格通过展开行要打开子级的表格,如果利用官网中的展开行的方式去实现其实是有点困难的首先实现行展开,这个是用到了elementUI中的一个属性通过设置 type="expand" 和 Scoped slot 可以开启展开行功能,el-table-column 的模板会被渲染成为展开行的内容，展开行可访问的属性与使用自定义列模板时的 Scoped s
转载
2024-02-16 11:42:37
139阅读
在使用element-ui的时候经常会遇到需要修改组件默认样式。 我目前知道的有两种方法： 1.通过创建一个css文件，然后在某一个组件中引用，css文件中使用
转载
2022-04-21 13:46:38
1435阅读
「????」场景近期着手开发基于ElementUI的后台管理系统，偶然间发现「el-select」下拉选择时候遇到一个问题，当渲染下拉选项的「options」的数据量过多时「本项目中的数据条目已过万」，就会出现下拉选择器卡顿的情况，尤其是在模糊匹配过滤的情况下，显得十分的卡顿。初始化选择器的时候，也会点击无反应，有时候需要点击多次才可出现「dialog」弹窗(本次下拉筛选在弹窗中实现)。 翻阅多篇
转载
2024-10-10 10:56:17
371阅读
任务二 Vue-cli&ElementUI1.Vue-cli1.1 什么是Vue-cliVue cli是基于Vue的应用开发提供的一个标准的脚手架工具.为应用搭建基础的框架结构,提供插件、开发服务、Preset、构建打包功能 Vue cli 背后集成了现代化开发的诸多功能,通过简单的命令就可以完成 "零配置"的项目环境搭建1.2 安装Vue-cli步骤在安装vue-cli前，要确认自己的电
转载
2024-10-17 11:30:40
110阅读
前言：最近想练习一下JS的API，经过再三思考，自认为用原生JS写UI组件是一个好方法，理由有：a. 熟悉大量原生API，像什么字符串，数组，DOM操作是肯定跑不了的b. 可以锻炼逻辑思维能力。插件的需要基本一样，要实现什么功能不用自己太多考虑可以把主要精力放在功能实现上面，即代码层面的分析和解决问题能力c. 可以加强自己的信心。写组件就是对自己前端能力的综合锻炼，涉及的知识面会很广。
Tlist2.time.forEach((item,index) => {
}
原创
2023-07-24 09:41:43
276阅读
块元素(block element)一般是其他元素的容器元素，块元素一般都从新行开始，它可以容纳内联元素和其他块元素,常见块元素是段落标签'P。"form"这个块元素比较特殊，它只能用来容纳其他块元素。
如果没有css的作用，块元素会顺序以每次另起一行的方式一直往下排。而有了css以后，我们可以改变这种html的默认布局模式，把块元素摆放到你想要的位置上去。而不是每次都愚蠢的另起一行。需要
