- 博客(157)
- 资源 (2)
- 收藏
- 关注
原创 TypeScript的鸭子类型,结构化类型系统(Structural Type System)和多余类型检测(Excess Property Checks)解惑
你只需要知道,在ts里面,声明一个对象类型的时候,他的含义并不是一个确定的对象类型,而是可以有额外的属性,并且定义的对象的属性只能多不能少。也就是包含这个对象,或者说必须是这个对象的子类。
2025-05-17 16:59:50
577
原创 vue3+ts+pinia+vite实战后台管理系统一(框架搭建和配置)
如果你的组件是Home.vue,About.vue这样的名字,那么会报multi-word的错误。意思就是不能这样取名字。把下面的自定义规则加上就可以关闭这个检查。rules:{主要讲解了框架搭建和配置。下一篇介绍登录模块的搭建。
2025-04-28 17:15:11
1043
原创 关于vscode运行nodejs或者js代码端口被占用的问题解决
通过Run Code菜单运行.js文件。第一次是没有问题的,但有时候修改代码或者因为别的原因再次运行就会报端口占用。我把vscode重启也不能解决问题。想了半天,于是我想知道是谁占用了8888端口?我们可以知道,直接通过Run code的方式居然会启动一个独立的node进程。百度了一下,可以通过下面的命令获取到占用8888端口的应用的pid。最后通过pid在任务管理器里面发现占用的程序居然是node.exe。
2025-04-15 19:13:57
213
原创 element-plus文档解析之Layout布局(el-row,el-col)
这是element-plus提供的响应式布局组件。可以非常方便的实现响应式布局以及快速按比例分块。例如实现下面的效果:第一行:宽度占100%第二行:宽度1:1第三行:1:1:1第四行:1:1:1:1第五行:1:1:1:1:1:1这里文档给的例子都是等比例平分。实际上,你想怎么分都可以。例如1:2:1。
2025-03-12 20:05:12
1530
1
原创 前端适配探索之关于2k,4k分辨率的适配的思考。
本篇文章是为了更好的理解屏幕适配。因为这样的问题如果不思考的话,在实际开发的时候非常的让人困惑。
2025-03-08 16:24:59
611
原创 js判断内容是否为空(包括数组,对象,字符串)
这是一个非常常用的功能。主要有两种实现方式,一种是实现一个统一的isEmpty方法用于处理各种类型的判空。另一种则是提供单独的方法判断各类型是否为空。例如isEmptyString,isEmptyObject,isEmptyArray等。
2025-02-26 16:16:36
613
原创 JavaScript基础之深拷贝浅拷贝
创建一个新的数组或者对象,并将原数组或者对象的顶层属性逐一复制到新创建的对象或者数组中。对于基本数据类型,直接复制其值。对于引用类型(对象,数组,方法),仅仅复制该引用。// 浅拷贝示例//3copy.a = 4;//1在这个示例中,我们修改了拷贝的新对象的nested对象的b属性的值,原始对象的nested对象的b属性值也跟着发生了改变。而修改拷贝对象属性a的值,原始对象的属性a的值没有跟着改变。1.使用Object.assign方法这是js给我们提供的浅拷贝方法。
2025-02-20 17:05:16
482
原创 关于事件捕获和事件冒泡的理解
我一直对事件捕获和事件冒泡是挺困惑的,好像理解了,但又感觉哪里不对。这篇文章打算深入探讨一些细节性的问题,更好的理解事件捕获和事件冒泡。
2025-01-23 20:01:58
1117
原创 create-react-app 创建react项目报错 ERESOLVE unable to resolve dependency tree
实际上, 你通过npm创建的项目虽然报错了,但实际上是可以用的,你可以通过npm start跑起来,但会报找不到web-vitals的错误,你可以手动安装web-vitals,或者把web-vitals相关代码删除。同时你可以手动设置react和react-dom的版本,react-scripts的版本是不可以设置的,如果设置为4.0.3会报错跑不起来,只能用最新的5.0.1。这个非常的蛋疼,意思是testing-library这个库的版本需要react18,但现在安装的是react19。
2024-12-23 21:17:12
1039
原创 React基础知识四 Hooks
hooks是react 16.8(2019年)出的新特性。react有两种形式来创建组件——类式和函数式。在hooks之前类式组件就是react最主流的编程方式。这个时候,函数式组件是非常鸡肋的,几乎没什么用。因为函数式组件不能保存数据状态,所以只能用于一些简单的展示的场景,传什么数据就展示什么数据(因为只有props是可以用的并且函数组件是没有生命周期的。但因为函数式编程的思想在前端是普遍流行和推崇的。我猜想react团队在设计函数式组件的时候肯定已经想到了这个问题。
2024-12-06 09:45:31
1087
原创 React基础知识三 router路由全指南
这个自定义的高阶组件,内部也是使用了useNavigate,所以是router6才可以这么用。router5是自带一个withRouter函数的,只是这个函数在router6被移除了。我们自己实现的这个只是叫withRouter这个名字,内部实现是不一样的。因为useNavigate只能在函数组件里面使用,我们怎么在类组件里面也能用呢?就是使用高阶函数,中间套一个函数组件,并将navigate 放到props里面,经过这个骚操作,我们就可以在类组件的props里面获取到navigate了。
2024-12-03 11:12:15
1444
原创 React基础知识一
写的东西太多了,照成csdn文档编辑器都开始卡顿了,所以分篇写。需要安装下面三个包。1.1 在html中引入CND在html中使用react是一种简便的方式。地址为:https://zh-hans.react.dev/learn/installation需要引入下面这三个CDN注意:这三个顺序是不能变的1.2 React初体验1.2.1 JSX写法(掌握)在html里面添加下面的代码。注意一定要添加type="text/babel"不然是会不识别语法的。1.2.2 React原始写法(了解
2024-11-21 08:46:09
1117
原创 Object.defineProperty和响应式
静态方法会直接在一个对象上定义一个新属性,或修改其现有属性,并返回此对象。运行下面的代码可以观察输出。value:1})console.log(obj1)//输出{}console.log(obj1.property1)//输出1obj1.property1输出1,这是符合我们的预期的。但obj1却输出{},我们期待的应该是{property1:1}。这就非常的奇怪了。明明obj1.property1可以输出property1的值,但输出obj1对象的时候却是空对象。
2024-11-18 16:40:20
436
原创 Object.create方法的使用
官方定义: 以一个现有对象作为原型,创建一个新对象。简单来说,Object.create()就是用来实现继承的。Object.create(null)这种方式可以创建一个纯粹的对象,比Object还纯粹。通过Object.create(null)创建的对象是连Prototype都没有的。所以你也没法调用toString等方法。
2024-11-18 16:39:51
249
原创 AMD CMD UMD CommonJs ESM 的历史和区别
在ESM出来之前,js是没有官方模块规范的。CommonJS凭借nodejs的知名度肯定是名气最大的。AMD CMD虽然都是大佬出的,但规范没法统一,这时候UMD出来解决了CommonJS、AMD、CMD的兼容统一问题。但ESM出来之后,这一切都将变成历史。总之,新代码用ESM就对了。
2024-09-14 11:07:55
285
原创 ERROR Failed to get response from https://registry.npm.taobao.org/ 错误的解决
这个问题最近才出现的。可能跟淘宝镜像的证书到期有关。
2024-01-26 11:19:13
2746
9
原创 v-show和v-if的区别以及显示隐藏不生效的奇怪现象以及点击索引错位问题的解释
基本概念没什么好讲的。有时候会遇到莫名其妙不显示的问题,这都是因为对这两个概念理解不透彻造成的。
2023-07-19 15:30:16
1969
原创 uniapp font-weight: bold不生效
font-weight只支持normal bold这样的值,是不支持数字的,写数字实际上在范围内都是会自动转化成normal bold这些值的,没有中间大小。这个确实就是这样的。解决办法就是写在style里面就可以了,小程序就是这样的,别的平台就不知道了。这可能是小程序的渲染模型导致的。
2023-07-06 09:05:54
1715
原创 关于 css img使用margin auto 不能水平居中的问题
在父容器有固定宽度的情况下,设置img为 margin:0 auto实现水平居中,这时候发现没有效果。这是因为img是inline-block,需要设置成block才有效果。span也是不可以了。但是通过div设置text-align就可以。
2023-06-28 15:24:58
540
原创 uniapp css width宽度100%导致界面右边超出屏幕或者padding导致出现滚动条
这实际上是一个纯粹的css问题,在小屏幕上非常容易出现。原因就是你的view使用了padding,而padding是算自身宽高的,而使用width 100%的时候,就变成了100% width加上padding的内容。所以就会在右边多出一部分内容。解决办法就是设置box-sizing: border-box。默认是box-sizing: content-box;
2023-06-27 08:47:56
4472
原创 uniapp css使用margin的时候导致出现垂直滚动条问题
最开始不知道是怎么回事,页面明明还没有到达底部,怎么就出现垂直滚动条了。这里的原因就是最外层或者比较外层的view使用了margin就会出现这样的情况。换成padding不会。这是最简单的原因,你可以试一下下面的结构,必然触发,触发条件非常的简单。
2023-06-27 08:39:13
1237
原创 uniapp 通过npm安装插件包 提示安装成功 但实际上并没有安装
我产生的原因是因为我用的是webstorm作为代码编辑器。hbuilder只用于编译等工作。这个问题是webstorm的问题,在webstorm里面使用终端命令就会出现这种情况。
2023-06-24 13:11:12
441
原创 uniapp ly-tree 组件报 [“usingComponents“][“style“] 未找到
真正的原因是,ly-tree这个组件不支持scss,你可以改成less或者使用原生css。在生成的小程序代码里面会出现一个style,这个路径是不存在的。
2023-04-12 11:08:03
1177
原创 css 固定定位position:fixed 拦截了点击事件,导致后面组件无法使用@click的解决办法
我写了一个没有数据的通用界面,当网络请求没有数据的时候显示。主要代码如下,其实就是固定定位居中。这个存在很严重的问题,就是后面的控制的点击事件全部被拦截了。找了半天也没找到解决方案。最后发现只要设置下面这个属性就可以了。设置z-index是没有效果的。
2023-04-10 16:46:15
1346
原创 选择微信原生小程序还是uniapp?
语法学vue和react,东学一点西学一点,造成的最大问题就是,既不兼容vue也不兼容react。前端的技术栈都不能直接使用。没有状态管理,数据存储非常的麻烦和简陋。入门的时候用微信原生小程序,熟悉了之后,马上转uniapp。我有强有力的依据来说明为什么我确信要用uniapp开发小程序。这个问题还是困扰过我的。
2023-01-20 23:54:34
9837
2
原创 深入理解JavaScript ES6 Promise基本使用和进阶讲解
一项新技术的出现一定是为了解决某个痛点问题的。ES6的Promise就是为了解决ES5在处理异步任务时所存在的问题。所以。
2022-12-19 21:58:45
667
原创 css div等块元素设置display:inline-block存在间隙问题
需要重新设置子元素的font-size。而且会出现下面元素下移的情况。**也会出现元素下移的情况。只是每个子元素都要设置float,有一点点麻烦。如果设置inline-block后,又设置float,还是会有空格。也就是这里的间隙实际上是来自div和div之间的换行转变成空格导致的。可以包裹一个空的父元素,就为了解决这个问题。我们给块元素例如div设置display:inline-block,会发现元素之间存在空隙。父元素里面的内容也是会影响。可以包裹一个空的父元素,就为了解决这个问题。
2022-12-12 18:09:00
2024
原创 DevTools 无法加载来源映射:无法加载 chrome-extension: 警告的原因以及如何去除(全网最全 最详细解决方案)
是类似这样的一个警告。每次都有看着还是挺难受的。这个警告的原因是你的浏览器插件造成的。例如警告已经很明确的告诉你是chrome-extension,也就是谷歌插件的问题。后面的字符串其实就是这个插件的id。可以看到对应的id就是下面这个插件。知道是哪个插件就好办了。解决方案一:(不太推荐)禁用或者删除插件。虽然可以起到效果,但是有可能这个插件我平时是要用的,频繁切换很麻烦。解决方案二:(推荐)打开控制台,点击右边的设置按钮,会出现下面的选项。把仅限已选择的上下文这个选项勾上。这个选项只会禁止
2022-12-06 19:37:24
17285
10
原创 webpack使用详解
官方定义:从本质上来说,webpack是一个现代的JavaScript的静态模块打包工具。webpack是前端工程化的一个解决方案。提供了前端模块化功能支持,模块混淆,代码压缩,处理浏览器JS兼容性,性能优化等强大功能。
2022-11-18 19:00:02
2512
原创 TypeError: Cannot read properties of undefined (reading ‘NormalModule‘) 错误的解决方案
从现象猜测,可能就是你安装插件的版本和本地的webpack不兼容导致的。
2022-11-18 14:52:57
5949
2
原创 Vue ref获取元素和组件实例
在写Vue的过程中,我们从来不会写这种代码,但是下面的代码在vue里面是可以运行的。我们很少去获取元素的,因为根本不需要,我们只需要修改数据让vue自动帮我们更新UI就行。el会直接获取顶层元素,如果有多个元素,那么会获取第一个node节点,一般是#text,也就是换行。这是获取到的代理对象,里面有showBanner方法,可以证明,这个就是Banner的代理对象。,根本就不需要先找到具体的元素。获取组件实例后,我们是可以调用组件的方法的,这个还是有点用的。最后,获取到了banner组件的顶层元素。
2022-11-16 16:57:08
7274
原创 Vue.js 条件渲染全解析
注意标题是而不是条件判断。Vue给v-if这类条件判断属性取名叫条件渲染。这些属性的目的是判断要不要渲染这些元素,而不仅仅是所谓的判断,是否渲染才是最主要的功能。
2022-11-14 22:01:31
506
原创 javascript事件处理三 事件委托
什么是事件委托?就是把事件的处理委托给别人(别的方式)干。为什么要这样做?因为这样可以某种程度上提高效率,或者能实现原来不能实现的功能。总之有好处我才委托的,不然我自己直接干了。
2022-11-11 11:39:08
477
原创 javascript事件处理二 事件对象event详解及target和currentTarget区别
在处理事件的时候,所有和事件相关的东西都封装到event这个对象里面。所以这个对象非常的重要。这个对象有非常多的内容,我们讨论几个计较常见和以及比较难区别的target和currentTarget。
2022-11-09 21:00:56
1839
2
Android内核剖析 柯元旦.pdf
2018-01-26
Android应用测试与调试实战
2018-01-12
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人