- 博客(70)
- 问答 (1)
- 收藏
- 关注
原创 基于element-plus 黑白主题切换
然后在main.js import "element-plus/theme-chalk/dark/css-vars.css";后引入即可,浅色同理。黑白模式切换相对是比较交单的,仅此作为学习记录,完毕!!
2024-10-31 23:19:05 382
原创 定高与不定高虚拟列表
在日常代码开发过程中,总会遇到大数据量的问题,当我们需要加载显示几千上万的数据的时候,如果我们是一次性渲染,那肯定就会出现严重的卡顿现象,这对用户体验是非常差的,也会让我们的项目,可用性大大降低,为此我们可以使用虚拟列表这个解决方案,只显示我们可视区域内可展示的数据量,这样就大大降低了页面卡顿的概率。
2024-10-30 23:25:59 1018
原创 基于vite和vue3、 eslint、prettier、stylelint、husky规范
综上所述,通过使用ESLint、Prettier、Stylelint和Husky,我们可以实现代码的静态分析、格式化和风格检查,并在团队中推行统一的代码规范。这将帮助我们提高代码质量,提高开发效率,降低维护成本。
2024-10-22 23:21:03 1265
原创 Vue3 + js-echarts 实现前端大屏可视化
这里介绍一下本人用的两种方案的优缺点方案实现方式优点缺点scale1.通过scale属性,根据屏幕大小,对图表进行整体的等比缩放1.代码量少,适配简单2.一次处理后不需要在各个图表中再去单独适配1.因为是根据 ui 稿等比缩放,当大屏跟 ui 稿的比例不一样时,会出现周边留白情况2.当缩放比例过大时候,字体会有一点点模糊,就一点点3.当缩放比例过大时候,事件热区会偏移。vw vh1.按照设计稿的尺寸,将px按比例计算转为vw和vh1.可以动态计算图表的宽高,字体等,灵活性较高。
2024-07-31 23:41:38 2145
原创 VUE2及其生态查漏补缺
自定义指令总结:一、定义语法:(1).局部指令:new Vue({directives{指令名:回调函数}})(2).全局指令:Vue.directive(指令名,配置对象) 或 Vue.directive(指令名,回调函数)二、配置对象中常用的3个回调:(1).bind:指令与元素成功绑定时调用。(2).inserted:指令所在元素被插入页面时调用。(3).update:指令所在模板结构被重新解析时调用。三、备注:1.指令定义时不加v-,但使用时要加v-;
2024-07-01 20:16:57 1173 6
原创 前端进阶-js查漏补缺
/ 自定义迭代器return {})// 配合扩展运算符,或者Array.from,容有迭代器的数据结构,都会自动转成数组。
2024-06-15 20:22:32 456
原创 React 项目记录
1、@ 别名 安装 npm install -D @craco/craco在根目录创建一个 crao.config.js 文件,代码如下2、自动联想,在根目录创建 jsconfig.json 文件,代码如下VSCode会自动读取 `jsconfig.json` 中的配置,让vscode知道@就是src目录3、mock数据安装 npm install -D json-server@0.17.3准备一个json文件。
2024-05-16 23:00:37 571
原创 Vue3 + Js + Element-Plus + VueX后台管理系统通用解决方案
主要是切换国际化,这里简单文字代替,实际使用的话就根据自己的需要搞,文件中有相关vuex代码,都会放在开头仓库里面。
2024-04-21 22:52:14 2033
原创 npm安装 electron 报错
降低一下node版本, 具体降低到多少不确定,反正我当时用的是 node 14.16.1。2、经过上面之后,有可能会出现下面一个问题。
2024-01-02 23:27:08 1502 1
原创 基于Elemnet-plus 封装的功能表格,基本囊括element-plus 官网表格的所有使用场景
这是一个多用途的基于element-plus 封装的表格组件,基本上elemnet-plus 官网涉及到的使用场景,都可以,而且使用上来说会简单许多,配置上类似与vxe-table 的使用,下面逐一展示各种场景的使用方式,基本上与el-table 使用方式类似,上手成本低。使用表格的地方列配置},},slots: {},},tableData 数据},},},},
2023-12-28 00:19:18 3013
原创 Vite 了解
简单概括就是,我们在运行 npm润dev 的时候,vite 会搭起一个node服务器, 然后我们请求.vue文件的时候,在返回体中,会将.vue文件,当做js来处理,返回 也就是设置 返回类型是 text/javascript,也就是.vue文件里面的内容会在node服务器转成js。相关概念:浏览器的同源策略:协议、域名、端口其一不一致,就会发生跨域,是在请求返回的时候发生的。这样就可以减少我们打包后的代码体积了,这个是用在我们的生产环境的,开发环境不需要。mock文件夹下的index.js文件。
2023-11-29 22:36:24 326
原创 webpack plugin
这里用到 emit 钩子 及make 钩子,前者是串行后者是并行。webpack.config.js中的配置。让 小的js 文件直接内联到 html中。
2023-11-22 21:04:55 681
原创 webpack loader
如果patch中有return 则不糊执行后续的操作,而是直接返回到上一个loader执行,如果没有就不用执行,下面是在loader中有返回值的意思,直接返回到loader执行操作。这里 module.exports = function(){} 空函数即可。异步loader (同步loader不能调用异步方法)webpack.config.js 配置。目前 只有 main.js 文件。打包后文件中就会多出坐着相关信息。自己的第一个loader。webpack 中的使用。webpack 配置。
2023-11-22 15:55:31 674
原创 webpack 配置
corejs处理,在项目根目录下的 babel.config.js 文件配置。webpack.config.js文件。babel.config.js文件。记录学习 webpack 的过程。.eslintrc.js 文件。
2023-11-21 23:13:36 781
原创 bfc 简单理解及应用
可以看到,由于img 左浮动了,形成了自己的bfc容器,不对外界产生影响,所以,图片的高度,不会对main标签产生影响,要解决这个问题,可以让main标签页变成一个bfc容器, 那么由于bfc容器的特性,其内部的渲染不会对外界产生影响,main 的高度自然就等于图片的高度了。bfc 是 Block formatting context 的缩写,也就是块级格式化上下文,就是让元素形成独立的渲染区域,bfc容器内部的渲染对外部不会有影响。以上便是bfc的简单理解。
2023-11-14 09:27:59 103
原创 css3 初步了解
简而言之,css3 就是 css的最新标准,使用css3都要遵循这个标准,CSS3 已完全向后兼容,所以你就不必改变现有的设计,
2023-11-13 22:45:31 978
原创 后台管理系统通用解决方案
第十二章:课程总结## 12-1:课程总结那么到这里我们整个的课程就算是全部结束了那么回顾一下整个课程,整个课程我们分成了10个章节进行讲解:1. 编程规范2. 登陆处理3. `Layout` 处理4. 后台综合方案5. `ElementPlus` 组件6. 权限处理7. 动态表格处理8. 编辑器处理9. 部署方案。
2023-10-11 21:40:52 415
原创 iconfont symbol引入使用有彩色,通过class引入没有彩色
iconfont symbol引入使用有彩色,通过class引入没有彩色
2023-03-27 00:14:45 699
原创 数组常用几个方法(sort、find、findIndex、filter、map、reduce、includes)的简单实现、
数组常用几个方法(sort、find、findIndex、filter、map、reduce、includes)的简单实现、
2023-01-17 14:55:39 209
空空如也
QT OPENCV 安装问题
2021-07-18
TA创建的收藏夹 TA关注的收藏夹
TA关注的人