凡小多-CSDN博客

原创在vscode中运行Hbuilder创建的项目

想必习惯使用vscode的人突然使用HBuilder很不习惯吧，但是HBuilder创建的项目本身没有调试功能。

2023-07-21 16:33:13 6721 15

原创基于el-input的数字范围输入框

在做筛选时可能会出现数字范围的筛选，例如：价格、面积，但是elementUI本身没有自带的数字范围组件，于是进行了简单的封装，不足可自行进行优化满足功能：相关代码：

2023-04-28 14:50:24 3978 1

原创 vue中使用闭包（例如防抖和节流）失效问题（直接调用）

原因：这个和vue的事件绑定原理有关。如果直接在函数体内部使用的话，结果就是，一个匿名的立即执行函数来进行执行。由于每次触发点击事件都会返回一个新的匿名函数，就会生成一个新的函数执行期上下文(称之为执行栈)，所以就会防抖/节流就会失效。防抖/节流使用无效，（例如防抖，按钮点击多次依旧执行多次）----> 查看是闭包无效，定义的局部变量依旧为初值。----> 没有相应清除定时器。// 以下方法调用不生效。

2023-02-08 15:20:29 2349

原创 Nginx基本使用

zlib 库提供了很多种压缩和解压缩的方式， nginx 使用 zlib 对 http 包的内容进行 gzip ，所以需要在 Centos 上安装 zlib 库。OpenSSL 是一个强大的安全套接字层密码库，囊括主要的密码算法、常用的密钥和证书封装管理功能及 SSL 协议，并提供丰富的应用程序供测试或其它目的使用。make 是一个命令工具，它解释 Makefile 中的指令（应该说是规则）。，所以需要在 linux 上安装 pcre 库，pcre-devel 是使用 pcre 开发的一个二次开发库。

2023-02-06 14:27:06 770

原创 Linux基本使用

硬链接：我们知道，文件的基本信息都存储在 inode 中，而硬链接指的就是给一个文件的 inode 分配多个文件名，通过任何一个文件名，都可以找到此文件的 inode，从而读取该文件的数据信息。软链接：类似于 Windows 系统中给文件创建快捷方式，即产生一个特殊的文件，该文件用来指向另一个文件，此链接方式同样适用于目录。：查看文本内容（适合大文件）指定解压后的文件存放的位置。：查看文本内容，适合小文件。：用来查看当前目录文件。：查看当前命令所在目录。：移动文件或修改文件名。此时可以全局安装pm2。

2023-02-03 17:51:02 716

原创 vue3学习笔记之router(router4 + ts)

使用前端路由，当切换到新路由时，想要页面滚到顶部，或者是保持原先的滚动位置，就像重新加载页面那样。它们只注册一个新的路由，也就是说，如果新增加的路由与当前位置相匹配，就需要你用。属性可以定义路由的元信息。使用路由元信息可以在路由中附加自定义的数据。能做到，而且更好，它让你可以自定义路由切换时页面如何滚动。进行页面的跳转会同样也会创建渲染新的Vue组件，但是在。要将嵌套路由添加到现有的路由中，可以将路由的。记住，如果你需要等待新的路由显示，可以使用。，这将有效地添加路由，就像通过。作为第一个参数传递给。

2023-02-01 22:56:14 2819

原创 Pinia的使用（以vue3+ts+vite为例）

由于有了底层 API 的支持，Pinia store 现在完全支持扩展。不能直接解构，会失去响应性，pinia提供了。同步异步方法都可以，也可以进行互相调用。重置state初始值，注意只在。I有用，setup函数模式报错。使其解构响应性不丢失。

2023-01-30 10:15:00 2790 4

原创 vue3性能优化

一般前后端数据交互是前端发送请求，后端返回数据。缺点是每次获取新数据都需要提交新请求。实现是根据后端数据的改变推送新数据到前端，运用场景一般图表展示，图表数据实时变化。后端数据返回过多时，但不想分页或过滤优化，原理是删除可视区域外的DOM节点。VueUse 库已经集成了 webWorker —谷歌浏览器自带的 DevTools。也可以全局安装Lighthouse。的，所以可以使用这个插件进行包分析。

2023-01-20 10:09:55 2542

原创 Electron + vite + vue3简单实现

/ 渲染进程接收主进程传递信息。接收渲染进程传递数据，通过。'主进程传递信息 :>> '// 渲染进程传递主进程信息。接收/传递信息主进程。

2023-01-19 15:21:58 3513 4

原创 vue3学习笔记(总)——ts+组合式API(setup语法糖)

接受一个内部值，返回一个响应式的、可更改的 ref 对象，此对象只有一个指向其内部值的属性。也可以获取属性的浅层作用形式。1.4 triggerRef()强制触发依赖于一个浅层 ref 的副作用，这通常在对浅引用的内部值进行深度变更后使用。强制更新注意： ref()和shallowRef()不能一块写，不然会影响shallowRef 造成视图更新由于 ref底层调用了triggerRef()，所以会造成视图的强制更新1.5 customRef()创建一个自定义的 ref，显式声明对

2023-01-18 16:28:18 7673

原创 vite+vue3环境变量的配置

直接打开 dist 文件下的 index.html 不行会报跨域错误，可以使用。文件中自定义了越来越多的环境变量，你可能想要在代码中获取这些以。另外，Vite 执行时已经存在的环境变量有最高的优先级，不会被。为前缀的用户自定义环境变量的 TypeScript 智能提示。类文件会在 Vite 启动一开始时被加载，而改动会在。为前缀的变量才会暴露给经过 vite 处理的代码。应为这些环境变量在打包的时候是会被硬编码的通过。一份用于指定模式的文件（例如。默认情况下，Vite 在。Vite 在一个特殊的。

2023-01-18 14:36:28 5100

原创 unocss原子化

例如，ml-3（Tailwind），ms-2（Bootstrap），ma4（Tachyons），mt-10px（Windi CSS）均会生效。预设（实验阶段）是一系列流行的原子化框架的通用超集，包括了。安装图标库，根据地址栏后缀安装对应图标库。属性语义化无须class。

2023-01-18 09:12:12 948

原创 vue3学习笔记之样式穿透(:deep)及CSS 新特性(:soltted、:gloabl、v-bind、mouldCSS)

的方式，以保证唯一（而这个工作是由过PostCSS转译实现的），达到样式。标签会被编译为 CSS Modules 并且将生成的 CSS 类作为。渲染出来的内容，因为它们被认为是父组件所持有并传递进来的。通过在DOM结构以及css样式上加唯一不重复的标记。：全局选择器，定义全局样式，不用单开一个没有。默认情况下，作用域样式不会影响到。常用场景：一般用于TSX和渲染函数。：改变css解析时私有属性的位置。自定义注入名称（多个可以用数组）：在子组件定义样式插槽内容样式。常见作用场景：修改组件库样式。

2023-01-17 09:26:06 9531

原创 vue3学习笔记之TSX的使用

绑定事件按照React的风格来。构建的，所以安装的是。

2023-01-12 16:44:20 6692

原创 vue3学习笔记之Transition&TransitionGroup

height : 0;} .to {传入的这些 class 会覆盖相应阶段的默认 class 名。这个功能在你想要在 Vue 的动画机制下集成其他的第三方 CSS 动画库时非常有用，比如

2023-01-10 11:28:51 2028

原创 vue3笔记案例——Teleport使用之模态框

理想情况下，我们希望触发模态框的按钮和模态框本身是在同一个组件中，因为它们都与组件的开关状态有关。但这意味着该模态框将与按钮一起渲染在应用 DOM 结构里很深的地方。使用传送组件可以将组件传送至其他层级的DOM结构中父组件模态框组件结合了动画组件，实现模态框显示消失的动画效果

2023-01-04 09:35:37 702

原创 git push报错 ! [rejected] dev -＞ dev (non-fast-forward)

是本地库和远程库没有同步导致无法提交合并，冲突导致无法push。

2023-01-03 14:05:13 3654

原创 vue3笔记案例——Suspense使用之骨架屏

suspense的使用

2023-01-02 22:59:42 857

原创 npm install 安装依赖包 --save、--save-dev、-S、-D的区别以及与yarn命令的对比

dependencies：运行依赖，字面意思运行需要的依赖，生产环境下也必须存在。devDependencies：开发依赖，只在开发时存在，不会打包至生产环境中。，将依赖安装至运行依赖。，将依赖安装至开发依赖。

2022-12-28 11:18:23 3373 1

原创 js如何获取json数据的方法总结以及在不启动服务的情况下获取数据

可以将json文件数据写在js文件中并定义成全局变量，然后再其他js文件中使用即可。

2022-12-15 09:50:10 4981

原创 vue——监听鼠标中键（滑轮）滚动

实现场景：通过滚动中键切换图片等

2022-12-05 14:00:56 4669

原创网站变成灰色——grayscale

网站变成灰色有很多办法，但相比于换内容样式\UI而言，使用滤镜更为方便使用的灰度属性

2022-12-05 09:44:29 299

原创 vue指令之滚动动画

实现可视区域添加删除动画类名。为了更好的动画效果使用了。

2022-11-30 11:07:55 888

原创根据children内的指定key找父级的key

运用场景：如刷新菜单默认展开。

2022-10-30 18:19:32 384

原创 redux Toolkit(TypeScript版本)之基本使用

组件使用时将原来的,换成和即可import {

2022-10-28 11:44:47 777

原创 antd按需引入——vite-plugin-style-import -D

由于vite已经是按需引入antd组件，但没有按需引入样式所以需要插件。

2022-10-26 16:30:26 2642

原创 vite配置别名@以及别名输入提示

若还报错则可能是vite版本问题改成。如果 path 报错，可以安装。

2022-10-26 15:13:17 1213

原创 elementUI-el-input聚焦时按回车回刷新页面

el-form表单只有一个输入框，按回车默认触发提交按钮，导致提交刷新页面。在el-form表单中加。输入框中按回车页面刷新。

2022-10-24 09:51:56 925

原创『前端必备』本地数据接口—json-server

是一款小巧的接口模拟工具，一分钟内就能搭建一套 Restful 风格的 api，尤其适合前端接口测试使用。只需指定一个 json 文件作为 api 的数据源即可，使用起来非常方便，30秒入门——可以对接口数据进行增删改查。进阶操作还支持分页，排序等操作。开源地址主页地址Github项目地址。

2022-10-17 16:48:51 1124

原创后端返回文件流格式数据导出成Excel文件

【代码】后端返回文件流格式数据导出成Excel文件。

2022-10-09 14:40:29 524

原创 redux Toolkit的使用

Redux Toolkit 有一个名为 createSlice 的函数，它负责生成 action 类型字符串、action creator 函数和 action 对象的工作。您所要做的就是为这个切片定义一个名称，编写一个包含 reducer 函数的对象，它会自动生成相应的 action 代码。来消除手写Redux逻辑中的“样板文件”,防止常见错误，并提供简化标准Redux任务的API.

2022-09-30 09:45:12 309