摘要：
解决方法 配置vite-env追加element的类型文件 /// <reference types="element-plus/global" /> 阅读全文
posted @ 2024-06-22 18:44
HuangBingQuan
阅读(58)
评论(0)
推荐(0)
摘要：
环境 直接跑一个vue组件，正常的命令是这样的 vue serve src/components/demo1.vue 输出提示： Command vue serve requires a global addon to be installed. Please run npm i -g @vue/c 阅读全文
posted @ 2024-06-13 22:26
HuangBingQuan
阅读(16)
评论(0)
推荐(0)
摘要：
Webpack简介 Webpack是基于模块化的打包（构建）工具，它把一切视为模块； 它通过一个开发时态的入口模块为起点，分析出所有的依赖关系，然后经过一系列过程（压缩，合并），最终生成运行时态的文件。 webpack的特点： 为前端工程化而生：webpack致力于解决前端工程化，特别是浏览器端工程 阅读全文
posted @ 2024-06-03 13:10
HuangBingQuan
阅读(26)
评论(0)
推荐(0)
摘要：
plugin loader的功能定位是转换代码，而一些其他的操作难以使用loader完成，比如： 当webpack生成文件时，顺便多生成一个说明描述文件 当webpack编译启动时，控制台输出一句话表示webpack启动了 当xxxx时，xxxx 这种类似的功能需要把功能嵌入到webpack的编译流 阅读全文
posted @ 2024-06-03 12:29
HuangBingQuan
阅读(13)
评论(0)
推荐(0)
摘要：
const listeners = {}; export default { // 监听某一个事件 $on(eventName, handler) { if(!listeners[eventName]) { listeners[eventName] = new Set(); } listeners[ 阅读全文
posted @ 2024-06-01 15:50
HuangBingQuan
阅读(10)
评论(0)
推荐(0)
摘要：
Array.prototype.sort((a, b)=> a.localeCompare(b)) ### 举个例子 ['b', 'a', 'd', 'c'].sort((a, b) => a.localeCompare(b)) 阅读全文
posted @ 2024-05-22 14:25
HuangBingQuan
阅读(21)
评论(0)
推荐(0)
摘要：
export const AutoScale = (targetEl, options, root)=> { const el = document.querySelector(targetEl); if(!el) throw new Error("初始化失败"); const { width, h 阅读全文
posted @ 2024-05-14 15:55
HuangBingQuan
阅读(25)
评论(0)
推荐(0)
摘要：
const fs = require('fs'); const path = require('path'); class File { constructor(fileName, name, ext, isFile, size, createTime, updateTime) { this.fil 阅读全文
posted @ 2024-05-10 13:12
HuangBingQuan
阅读(17)
评论(0)
推荐(0)
摘要：
clip-path: polygon(50% 0, 0 100%, 100% 100%) 阅读全文
posted @ 2024-04-29 10:42
HuangBingQuan
阅读(7)
评论(0)
推荐(0)
摘要：
/** * 导出excel * * @param {blob} data 后端返回的文件流 * @param {String} fileName 文件名 */ export const exportFile = (data, fileName) => { const binaryData = []; 阅读全文
posted @ 2024-04-26 12:51
HuangBingQuan
阅读(14)
评论(0)
推荐(0)
摘要：
迭代器 背景知识 什么是迭代？ 从一个数据集合中按照一定的顺序，不断取出数据的过程 迭代和遍历的区别？ 迭代强调的是依次取数据，并不保证取多少，也不保证把所有的数据取完 遍历强调的是要把整个数据依次全部取出 迭代器 对迭代过程的封装，在不同的语言中有不同的表现形式，通常为对象 迭代模式 一种设计模式 阅读全文
posted @ 2024-04-16 10:14
HuangBingQuan
阅读(20)
评论(0)
推荐(0)
摘要：
前言：为了更好的代码提示，我们可以使用ts的@types/node包来增强代码提示 yarn add @types/node -D || npm i @types/node -D || pnpm i @types/node -D 在浏览器 JavaScript 中全局对象是 window， 而 No 阅读全文
posted @ 2024-04-10 13:23
HuangBingQuan
阅读(18)
评论(0)
推荐(0)
摘要：
什么叫做响应式呢？ 实际上是指一套代码能够在不同的设备下有着不一样的表现。响应式设计依托于 CSS3 中的媒体查询，通过查询当前设备的一个尺寸信息，然后应用不同的样式。 响应式设计在刚推出时非常的火，因为那个时候也没有什么专门针对移动设备设计的页面，而且一套代码就能解决 PC、平板和手机不同设备的各 阅读全文
posted @ 2024-04-03 14:34
HuangBingQuan
阅读(57)
评论(0)
推荐(0)
摘要：
使用Key 对于通过循环生成的列表，应该给列表每一项一个稳定且唯一的key，这个有利于在列表变动时，尽量减少删除，新增，改动元素。 使用冻结的对象 冻结的对象不会被响应化，应用场景（当一个列表无需变化时可以使用） 使用函数式组件 在模板中 添加 functional标记 在js中添加function 阅读全文
posted @ 2024-03-31 20:55
HuangBingQuan
阅读(14)
评论(0)
推荐(0)
摘要：
v-if能够控制是否生成vnode，也就间接控制了是否生成对应的dom。当v-if为true时，会生成对应的vnode，并生成对应的dom元素；当其为false时，不会生成对应的vnode，自然不会生成任何的dom元素。 v-show始终会生成vnode，也就间接导致了始终生成dom。它只是控制do 阅读全文
posted @ 2024-03-26 16:53
HuangBingQuan
阅读(20)
评论(1)
推荐(1)
摘要：
分析打包结果 由于vue-cli是利用webpack进行打包，我们仅需加入一个webpack插件webpack-bundle-analyzer即可分析打包结果 // vue.config.js const BundleAnalyzerPlugin = require("webpack-bundle- 阅读全文
posted @ 2024-03-26 10:09
HuangBingQuan
阅读(53)
评论(0)
推荐(0)
摘要：
在本地环境配置 https 证书 在使用 HTML5 的 API 时，很多 API 只能在 https 保证安全的情况下才能开启。这就要求我们在本地开发环境也能够配置 https，否则你需要每次部署到配有 https 的测试环境中才能看到预览效果，这对开发的敏捷度造成了极大的干扰。 本文和 WebA 阅读全文
posted @ 2024-03-25 17:05
HuangBingQuan
阅读(681)
评论(0)
推荐(0)
摘要：
判断xy是否变化了 true 变化了 false没变化 // 此写法可能会出bug 因为没有考虑0和NaN的情况 const hasChanged = (x, y)=> { return x !== y; } // 最终写法 const hasChanged = (x, y)=> { if(x y) 阅读全文
posted @ 2024-03-18 21:34
HuangBingQuan
阅读(12)
评论(0)
推荐(0)
摘要：
虚拟DOM 什么是虚拟DOM 虚拟DOM本质上就是一个普通的Js对象，用于描述视图的界面结构 为什么需要虚拟DOM树 主要为解决渲染效率问题。 在vue中，渲染试图会调用render函数，这种渲染不仅发生在组件创建时，同时发生在试图依赖的数据更新时。如果在渲染时，直接使用真实DOM，由于真实DOM的 阅读全文
posted @ 2024-03-13 12:33
HuangBingQuan
阅读(26)
评论(0)
推荐(0)
摘要：
比如 npx serve 执行本地的 serve命令，如果serve没有安装，则npx会自动的、临时的安装serve，安装好后，自动运行serve命令 阅读全文
posted @ 2024-02-18 00:07
HuangBingQuan
阅读(54)
评论(0)
推荐(0)
摘要：
防抖与节流的本质就是：通过闭包特性减少操作次数 举一个现实生活中的例子 // 两个大巴的故事 // 防抖， // A大巴：车上上去一个人，五分钟之内不上人，发车。 // 节流。 // B大巴：车上上去一个人之后，五分钟之后发车。 // 发车！网络请求（A => B) 提高利用率 减少B的压力。 // 阅读全文
posted @ 2024-02-13 18:46
HuangBingQuan
阅读(19)
评论(0)
推荐(0)
摘要：
Promise.resolve = new Promise(()=> resolve()) 应用场景 我们可以使用Promise.resolve来完成模拟数据 function getData() { return Promise.resolve([ { id: 0, name: "张三"}, { 阅读全文
posted @ 2024-01-01 21:07
HuangBingQuan
阅读(14)
评论(0)
推荐(0)
摘要：
随着新的一年的钟声敲响，祝大家2024年元旦快乐！愿你的代码如同流水般顺畅，bug远离你的键盘。在这个充满希望的新年里，愿你在编程的世界里发现更多的乐趣和创新。让我们一起在代码的海洋里航行，探索未知的领域，创造出更加精彩的作品。愿你在新的一年里，不仅技术日新月异，也能享受生活的每一个美好瞬间。新年快 阅读全文
posted @ 2024-01-01 20:56
HuangBingQuan
阅读(57)
评论(0)
推荐(0)
摘要：
contenteditable 全局属性 contenteditable 是一个枚举属性，表示元素是否可被用户编辑。如果可以，浏览器会修改元素的组件以允许编辑。 // 注入 打开F12 浏览器输入 document.documentElement.setAttribute('contentedita 阅读全文
posted @ 2023-12-27 16:54
HuangBingQuan
阅读(69)
评论(0)
推荐(0)
摘要：
文件上传 流程： 客户端将文件数据发送给服务器 服务器保存上传的文件数据到服务器端 服务器响应给客户端一个文件访问地址 测试地址：http://xxx/api/upload 键的名称（表单域名称）：imagefile 请求方法：POST 请求的表单格式：multipart/form-data 请求体 阅读全文
posted @ 2023-12-16 23:29
HuangBingQuan
阅读(39)
评论(0)
推荐(0)
摘要：
/** * 自定义组件全局注入 * @param app vue实例 */ import { defineAsyncComponent } from "vue"; export default function (app) { // 收集@/components所有.vue组件 const comp 阅读全文
posted @ 2023-12-12 22:31
HuangBingQuan
阅读(101)
评论(0)
推荐(0)
摘要：
indexDB简介 indexDB本质上就是存储数据，优点不受大小限制，当数据大于 > 5MB 时我们无法通过localStorage、cookie（只能存4k）存储 // 连接数据库 （连接的过程是一个异步的）window.indexedDB.open('库名称', '库版本号') >= 0 co 阅读全文
posted @ 2023-11-09 13:40
HuangBingQuan
阅读(195)
评论(0)
推荐(0)
摘要：
uni.chooseImage({ count: 1, // 图片张数 success: async res => { const reader = new FileReader(); reader.readAsDataURL(res.tempFiles[0]); reader.onload = a 阅读全文
posted @ 2023-11-08 14:03
HuangBingQuan
阅读(249)
评论(0)
推荐(0)
摘要：
String.prototype.padStart() padStart() 方法从字符串的开头用另一个字符串填充一个字符串到一定长度，并返回一个达到一定长度的结果字符串。下面说明了 padStart() 方法： String.prototype.padStart(padLength [,padSt 阅读全文
posted @ 2023-10-30 14:55
HuangBingQuan
阅读(455)
评论(0)
推荐(0)
摘要：
Symbol和访问器主要是来限制实例成员的 如果一个成员暴露出去只让读不让改，我们就可以在类中使用访问器 class Person { get name() { return "HuangBingQuan" } } 如果一个成员不让暴露出去（不让外界访问）那就使用Symbol作为属性值 functi 阅读全文
posted @ 2023-10-25 21:41
HuangBingQuan
阅读(24)
评论(0)
推荐(0)
摘要：
Vite 是一个现代化的前端构建工具，它提供了内置的环境变量来辨别当前环境是生产环境还是开发环境。在 Vite 中，可以通过检查 import.meta.env 对象来获取当前环境的信息。 import.meta.env 对象包含了一些常用的环境变量，其中最重要的是 MODE 变量。MODE 变量表 阅读全文
posted @ 2023-10-25 10:58
HuangBingQuan
阅读(4196)
评论(0)
推荐(0)
摘要：
any 大法 ✨ 前期开发代码量少，快速简单。 🚨 由于未定义 interface 导致整个项目充斥着大量 any 类型，项目沦为 AnyScript。 🚨 无法获得健全的 ts 语法检测功能，弱化了使用 ts 的作用。 🚨 后期维护成本高，后端修改字段，ts 语法无法检测。 interfac 阅读全文
posted @ 2023-10-19 10:48
HuangBingQuan
阅读(81)
评论(0)
推荐(0)
摘要：
前言 今天给大家分享一个在 React 项目中使用 TypeScript 遇到的错误 项目背景 React + TS 的项目配置，项目中关于 React 组件的使用 .tsx 后缀，其他单纯的文件使用 .ts 后缀 问题描述 在 React 组件附近定义泛型的箭头函数时产生 TS 报错警告，原本以为 阅读全文
posted @ 2023-10-18 18:02
HuangBingQuan
阅读(401)
评论(0)
推荐(0)
摘要：
泛型 有时，书写某个函数时，会丢失一些类型信息（多个位置的类型应该保持一致或有关联的信息） 泛型：是指附属于函数、类、接口、类型别名之上的类型 泛型相当于是一个类型变量，在定义时，无法预先知道具体的类型，可以用该变量来代替，只有到调用时，才能确定它的类型 很多时候，TS会智能的根据传递的参数，推导出 阅读全文
posted @ 2023-10-18 17:18
HuangBingQuan
阅读(29)
评论(0)
推荐(0)
摘要：
模块的加载机制 1、优先从缓存中加载 模块在第一次加载后会被缓存。 这也意味着多次调用 require() 不会导致模块的代码被执行多次。 注意：不论是内置模块、用户自定义模块、还是第三方模块，他们都会优先从缓存中加载，从而提升模块的加载效率。 2、内置模块的加载机制 内置模块是由 Node.js 阅读全文
posted @ 2023-10-09 18:03
HuangBingQuan
阅读(37)
评论(0)
推荐(0)
摘要：
uni-app textarea placeholder在小程序中错乱不兼容问题 解决方案 将textarea替换成editor即可 阅读全文
posted @ 2023-10-08 11:17
HuangBingQuan
阅读(164)
评论(0)
推荐(0)
摘要：
定义指令 全局定义 // 指令名称为：mydirec1 Vue.directive('mydirec1', { // 指令配置 }) // 指令名称为：mydirec2 Vue.directive('mydirec2', { // 指令配置 }) 之后，所有的组件均可以使用mydirec1和mydi 阅读全文
posted @ 2023-09-30 11:58
HuangBingQuan
阅读(19)
评论(0)
推荐(0)
摘要：
overflow: hidden;// 超出的文本隐藏 text-overflow: ellipsis;// 溢出用省略号显示 display: -webkit-box; -webkit-line-clamp: 2; //多行在这里修改数字即可 overflow:hidden;// 将对象作为弹性伸 阅读全文
posted @ 2023-09-28 16:11
HuangBingQuan
阅读(16)
评论(0)
推荐(0)
摘要：
yarn 的特别礼物 在终端命令上，yarn不仅仅是对npm的命令做了一个改名，还增加了一些原本没有的命令，这些命令在某些时候使用起来非常方便 yarn check 使用yarn check命令，可以验证package.json文件的依赖记录和lock文件是否一致 这对于防止篡改非常有用 yarn 阅读全文
posted @ 2023-09-26 23:40
HuangBingQuan
阅读(16)
评论(0)
推荐(0)
摘要：
yarn 的核心命令 初始化 初始化：yarn init [--yes/-y] 安装 添加指定包：yarn [global] add package-name [--dev/-D] [--exact/-E] 安装package.json中的所有依赖：yarn install [--productio 阅读全文
posted @ 2023-09-26 23:03
HuangBingQuan
阅读(102)
评论(0)
推荐(0)
浙公网安备 33010602011771号