ZL随心-CSDN博客

原创 Vue3 + js-echarts 实现前端大屏可视化

这里介绍一下本人用的两种方案的优缺点方案实现方式优点缺点scale1.通过scale属性，根据屏幕大小，对图表进行整体的等比缩放1.代码量少，适配简单2.一次处理后不需要在各个图表中再去单独适配1.因为是根据 ui 稿等比缩放，当大屏跟 ui 稿的比例不一样时，会出现周边留白情况2.当缩放比例过大时候，字体会有一点点模糊，就一点点3.当缩放比例过大时候，事件热区会偏移。vw vh1.按照设计稿的尺寸，将px按比例计算转为vw和vh1.可以动态计算图表的宽高，字体等，灵活性较高。

2024-07-31 23:41:38 1534

原创 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 1119 6

原创前端进阶-js查漏补缺

/ 自定义迭代器return {})// 配合扩展运算符，或者Array.from，容有迭代器的数据结构，都会自动转成数组。

2024-06-15 20:22:32 434

原创前端设计模式学习记录

以上便是部分设计模式，个人感觉前端，可能会用到多一点的，其他设计模式感觉用得极少，当然，也可能是我接触的业务不复杂。

2024-05-26 23:36:20 755

原创 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 554

原创 Vue3 + Js + Element-Plus + VueX后台管理系统通用解决方案

主要是切换国际化，这里简单文字代替，实际使用的话就根据自己的需要搞，文件中有相关vuex代码，都会放在开头仓库里面。

2024-04-21 22:52:14 1833

原创 vue3 + Element + nodejs 大文件上传、断点续传

大文件上传、断点续传

2024-03-20 23:26:22 800

原创 npm安装 electron 报错

降低一下node版本，具体降低到多少不确定，反正我当时用的是 node 14.16.1。2、经过上面之后，有可能会出现下面一个问题。

2024-01-02 23:27:08 1461 1

原创基于Elemnet-plus 封装的功能表格，基本囊括element-plus 官网表格的所有使用场景

这是一个多用途的基于element-plus 封装的表格组件，基本上elemnet-plus 官网涉及到的使用场景，都可以，而且使用上来说会简单许多，配置上类似与vxe-table 的使用，下面逐一展示各种场景的使用方式，基本上与el-table 使用方式类似，上手成本低。使用表格的地方列配置},},slots: {},},tableData 数据},},},},

2023-12-28 00:19:18 2454

原创 Vite 了解

简单概括就是，我们在运行 npm润dev 的时候，vite 会搭起一个node服务器, 然后我们请求.vue文件的时候，在返回体中，会将.vue文件，当做js来处理，返回也就是设置返回类型是 text/javascript，也就是.vue文件里面的内容会在node服务器转成js。相关概念：浏览器的同源策略：协议、域名、端口其一不一致，就会发生跨域，是在请求返回的时候发生的。这样就可以减少我们打包后的代码体积了，这个是用在我们的生产环境的，开发环境不需要。mock文件夹下的index.js文件。

2023-11-29 22:36:24 308

原创 webpack plugin

这里用到 emit 钩子及make 钩子，前者是串行后者是并行。webpack.config.js中的配置。让小的js 文件直接内联到 html中。

2023-11-22 21:04:55 655

原创 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 597

原创 webpack 配置

corejs处理，在项目根目录下的 babel.config.js 文件配置。webpack.config.js文件。babel.config.js文件。记录学习 webpack 的过程。.eslintrc.js 文件。

2023-11-21 23:13:36 745

原创 bfc 简单理解及应用

可以看到，由于img 左浮动了，形成了自己的bfc容器，不对外界产生影响，所以，图片的高度，不会对main标签产生影响，要解决这个问题，可以让main标签页变成一个bfc容器, 那么由于bfc容器的特性，其内部的渲染不会对外界产生影响，main 的高度自然就等于图片的高度了。bfc 是 Block formatting context 的缩写，也就是块级格式化上下文，就是让元素形成独立的渲染区域，bfc容器内部的渲染对外部不会有影响。以上便是bfc的简单理解。

2023-11-14 09:27:59 92

原创 css3 初步了解

简而言之，css3 就是 css的最新标准，使用css3都要遵循这个标准，CSS3 已完全向后兼容，所以你就不必改变现有的设计，

2023-11-13 22:45:31 969

原创 html5 初步了解

简而言之，html5 其实就是新的一代html标准！

2023-11-13 21:34:51 376

原创后台管理系统通用解决方案

第十二章：课程总结## 12-1：课程总结那么到这里我们整个的课程就算是全部结束了那么回顾一下整个课程，整个课程我们分成了10个章节进行讲解：1. 编程规范2. 登陆处理3. `Layout` 处理4. 后台综合方案5. `ElementPlus` 组件6. 权限处理7. 动态表格处理8. 编辑器处理9. 部署方案。

2023-10-11 21:40:52 370