- 博客(23)
- 收藏
- 关注
原创 echarts警告:There is a chart instance already initialize on the dom
创建一个echarts图表的代码封装成一个方法,一旦多次调用这个方法创建图表的时候使用的dom节点都是同一个,每次都会init一个echarts实例,就会在控制台报如下警告:There is a chart instance already initialize on the dom(在dom上已经初始化了一个图表实例)。
2024-06-19 10:59:27 291
原创 vue3 + vite 按需引入Element Plus默认英文组件修改为中文
<template> <div class="upload-excel"> <el-config-provider :size="size" :z-index="zIndex" :locale="locale"> <ReadExcel></ReadExcel> </el-config-provider> </div></template><script setup
2024-05-30 16:50:00 265 2
原创 理解 React 组件生命周期
React 组件生命周期指的是组件从创建到销毁的整个过程。主要包括三个阶段:挂载(Mounting)、更新(Updating)和卸载(Unmounting)。每个阶段都对应着特定的生命周期方法,允许开发人员在不同的阶段执行相关操作。
2024-02-04 19:05:28 400
原创 React的路由配置
在src目录下新建一个Router/index.js文件用于管理路由,这里需要引入一些对应的组件,比如首页啊,关于我们页面啊之类的页面,还有路由包文件。react-router:是基本的router包,里边函的内容较多,但是在网页开发中有很多用不到,现在的市面上的课程讲的基本都是这个包的教程。react-router-dom:随着react生态环境的壮大,后出现的包,这个包比react-router包轻巧了很多。Route的props path为路径,component为路径对应的页面。
2024-01-14 23:15:38 430 1
原创 深入探索 TypeScript:接口、类和泛型
在 TypeScript 中,接口是用来描述对象的形状(结构)的一种方式。通过接口,我们可以定义对象应该包含哪些属性以及这些属性的类型。${${`);在上面的例子中,我们定义了一个Person接口,它要求具有name和age属性。然后我们编写了一个函数,它接受一个Person对象作为参数。这样一来,当我们传入符合Person接口定义的对象时,就能够进行类型检查。在本篇博客中,我们深入探讨了 TypeScript 中的接口、类和泛型三个重要概念。
2024-01-01 20:59:05 393
原创 前端环境搭建react18+typescript+webpack5项目 - 项目初始化
pnpm 、npm和yarn都是Node.js和JavaScript项目的包管理器。每种都有自己的优点和缺点,选择使用哪一种最终取决于你的具体需求和偏好1.更快的安装和更新时间2.更少的磁盘空间使用3.更好地支持monorepos4. 更好地支持对等依赖5.更清晰的依赖树会在根目录生成一个在根目录新建基本的项目结构:index.html初始化cliD另外因为我们在App.tsx中引入了css文件,所以还需要安装相关的loader因为。
2023-12-24 22:44:02 1381 1
原创 node.js实现图片上传
如何使用Node.js和Express框架以及Multer中间件来实现简单的图片上传功能。这包括了添加文件大小限制、错误处理和使用正确的文件扩展名等重要细节。创建一个新的目录,并在其中初始化一个新的Node.js项目。在前端页面中,可以通过表单提交方式将图片上传到上述创建的接口。确保已安装Node.js和npm(Node.js包管理器)。的目录,用于存储上传的图片。在项目根目录下创建一个名为。
2023-12-16 16:53:15 826 1
原创 关于token的无感刷新
Token无感刷新是一种安全机制,用于在用户当前操作不受干扰的情况下更新访问令牌。通常,访问令牌(Access Token)用于验证用户身份并访问受保护的资源,在一定时间后会过期。传统上,当访问令牌过期时,客户端必须重新进行身份验证和获取新的令牌,这可能会导致用户体验变差。通过无感刷新机制,客户端可以在不中断当前操作的情况下继续访问受保护的资源。这意味着即使访问令牌已经过期,客户端也能够通过后台机制自动获取新的令牌,而无需用户手动干预或重新登录。这种机制可以大大改善用户体验,因为。
2023-12-16 16:06:56 596 1
原创 实现token鉴权:保护你的应用程序和API
Token 鉴权是一种基于令牌的身份验证方法,通常被用于 Web 应用程序和 API。它基于用户提供的凭证(通常是用户名和密码)生成一个加密的令牌,并将该令牌返回给客户端。客户端在之后的请求中携带这个令牌,服务器则用于验证用户的身份并授权其访问受保护的资源。
2023-12-16 15:54:47 979 1
原创 js之箭头函数
原因箭头函数没有this,箭头函数的this是继承父执行上下文里面的this ,这里箭头函数的执行上下文是函数fn1(),所以它就继承了fn1()的this,obj1调用的fn1,所以fn1的this指向obj1, 所以obj1.num 为 22。使用大括号就说明包含“函数体”,可以在一个函数中包含多条语句,跟常规的函数一样。与正式的函数表达式创建的函数对象行为是相同的。es6 新增了使用胖箭头(=>)语法定义函数表达式的能力,很大程度上,箭头函数实例化的。注意:简单对象(非函数)是没有执行上下文的!
2023-11-26 22:36:02 1754 1
原创 var、let 、const的区别
在使用let、const命令声明变量之前该变量都是不可用的。这在语法上,称为暂时性死区。使用var声明的变量不存在暂时性死区。
2023-11-18 15:23:10 64 1
原创 js继承的六种方式
用一个函数包装一个对象,然后返回这个函数的调用,这个函数就变成了个可以随意增添属性的 实例或对象。(原型上的属性是共享的,一个实例修改了原型属 性,另一个实例的原 型属性也会被修改!1、实例可继承的属性有:实例的构造函数的属性,父类构造函数属性,父类原型的属性。调用了两次父类构造函数(耗内存),子类的构造函数会代替原型上的那个父类构造函 数。1、只继承了父类构造函数的属性,没有继承父类原型的属性。1、可以继承父类原型上的属性,可以传参,可复用。2、每个新实例引入的构造函数属性是私有的。
2023-11-01 20:22:50 340 1
原创 JavaScript的重绘与回流
重绘(repaint):当元素样式的改变不影响页面布局时,比如元素的颜色,浏览器将对元素进行的更新,称之为重绘。回流(reflow):也叫做重排。当元素的尺寸或者位置发生了变化,就需要重新计算渲染树,这就是回流,比如元素的宽高位置,浏览器会重新渲染页面,称为回流,又叫重排(layout)。回流是影响浏览器性能的关键因素。因为一个元素的回流,可能会导致了其所有子元素以及紧随其后的节点、或祖先节点元素,或部分页面或整个页面的回流关系:回流必定会触发重绘,重绘不一定会触发回流。重绘的开销较小,回流的代价较高。
2023-10-31 20:51:55 210 1
原创 JavaScript中的浅拷贝和深拷贝方法
在JavaScript中,深拷贝和浅拷贝是两种常见的对象复制方式。浅拷贝只是复制了对象的引用,而深拷贝则是递归地复制了对象及其所有子对象。
2023-10-26 18:59:18 45 1
原创 JavaScript中的闭包
由于 counter 函数是通过 createCounter 函数创建的,因此 counter 函数可以问 createCounter 函数内的 count 变量。另外,闭包的使用也需要适度,因为过多使用闭包会影响代码的可读性和可维护性。因此,这里的闭包是指 counter 函数包含对 createCounter 函数环境的引用,这使得 counter 函数能够在其父级作用域之外访问到 count 变量。可以访问外部作用域中的变量和函数:一个闭包可以在定义它的函数的外部作用域中访问变量和函数。
2023-10-24 20:03:37 33
原创 javaScript的常用方法
4.提问窗口:prompt(“弹框内容(不可修改),文本框默认内容(可修改)”),弹框包括确定按钮、取消按钮、文本框,点击确定按钮返回文本框内容、点击取消按钮返回null。5.Math.round(Math.random()*10+10) 随机获取 10~20 之间的一个整数。4.Math.round(Math.random()*5+5) 随机获取 5~10 之间的一个整数。3.Math.round(Math.random()*10) 随机获取 0~10 之间的一个整数。
2023-10-05 21:10:11 83
原创 css3的新特性
一、CSS3实现圆角 - border-radius 二、盒子阴影 - box-shadow 三、文本阴影 - text-shadow 四、渐变 - gradient linear-gradient() 线性渐变 radial-gradient() 径向渐变 五、变化 - transform translate - 定义2D转换 translate3d - 定义3D转换 translateX - 转换X轴 translateY - 转换Y轴
2023-09-18 20:16:10 36
原创 js数组去重
思路3:循环取出每个元素,判断从前往后查找该元素的索引和从后往前查找该元素的索引是否相等,相等说明该元素有且仅有1个,不相等说明有重复的元素,要删掉一个。思路1:循环取出每个元素,判断从前往后查找该元素的索引和从后往前查找该元素的索引是否相等相等说明该元素有且仅有1个,不相等说明有重复的元素,要删掉一个。思路4:声明一个新数组用于存储不重复的值,循环取出每个元素,在新数组中查找有没有,如果没有就添加到新数组中。先排序,再循环数组,比较相邻的两个元素,如果相等就删掉1个。
2023-09-18 19:28:15 42
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人