- 博客(151)
- 收藏
- 关注
RSS订阅原创 Vue2和3中的插槽区别及其简单案例
Vue2和3中的插槽区别&插槽常用知识点温习和基本概念是一致的，也是匿名插槽、具名插槽、作用域插槽三种，只是基础语法有一些区别。下面让我们温习一下插槽的常用基础知识点。
2024-04-05 00:20:20
419
原创 html标签中lang属性踩的一个小坑，日常中还是需要留意的风险点
html lang。部有大量的广告行业英文缩写，比如CPC（Cost Per Click ），CPM（** Cost Per Click ），CPD（*Cost Per Click ）等等，然后浏览器（可能是国内的某些浏览器自带翻译器的那种）碰到英文就自动提示需要翻译，用户可能一直也把翻译默认打开着。如果需要有多语言切换的，顺便也要切换lang配置编码。HTML 的 lang 属性可用于声明网页或部分网页的语言，这对搜索引擎和浏览器是有帮助的。在html中lang是英语language的缩写，是语言的意思。
2024-02-10 00:55:18
333
原创 vue3中Fragment特性的一个bug，需要留意的注意事项
vue3中Fragment特性的一个bug，需要留意的注意事项。vue3中的Fragment 模版碎片特性是什么，简单的理解就是不在像vue2中那样必须在根节点在包裹一层节点了。
2024-01-21 21:46:18
611
原创 SyntaxError: /xxxx.vue: Unexpected token, expected “,“，[object Promise]export { render, staticRende}
webpack have the same syntaxError: /.../xxx.vue: Unexpected token, expected "," (1:8) for ALL Vue 2 components in the project
2023-08-18 23:12:50
772
原创 js计算一个矩形内部，有一个等比缩放的矩形，如何判断宽和高那个先溢出外层的矩形
一个任意矩形内部，有一个任意等比缩放的矩形，如何判断宽和高那个先溢出外层的矩形？宽和高那个先贴到边上？可以根据两个矩形的比例关系来判断宽和高那个先溢出。首先计算出两个矩形的宽高比，然后比较它们的大小关系。若外层矩形的宽高比大于内层矩形的宽高比，则内层矩形先溢出的是宽；反之，先溢出的是高。最近在做js canvas绘图需求时，遇到一个矩形图形重叠逻辑判断问题。
2023-05-13 20:14:36
210
1
原创 js在循环中使用正则失效异常的坑
js中在循环中使用正则表达式遇到的小坑原因：/111/g 这种写法看起来像string,但终究还是正则，正则属于引用型数据类型。引用型数据类型 传统意义中 需要我们"才能使其 内存指向独立出来，而不是让内存指向一直指向初始定义时的源头。ECMAScript包括两个不同类型的值：基本数据类型和引用数据类型。so正则表达式属于引用数据类型。打印还存在false。
2023-04-29 23:06:21
1175
原创 CSS实现文字镂空效果炫酷背景效果
CSS实现文字镂空效果炫酷背景效果css3中有一个mix-blend-mode的screen混合模式，可以轻松实现镂空文字效果。背景我们可以固定定位设置一个静态图片，gif动态图，视频video，svg动画等等。预期效果
2023-04-09 01:56:08
740
原创 TCP/IP和OSI的基础层级关系图，TCP/IP四层模型关系，TCP/IP和HTTP/HTTPS的关系图
TCP/IP和OSI的基础层级关系图，TCP/IP四层模型关系，TCP/IP和HTTP/HTTPS的关系图英文全称Transmission Control Protocol。英文全称Internet Protocol。tcp和ip是互联网众多通信协议中最为著名的。
2023-04-02 18:01:46
301
原创 Android startActivityForResult()废弃了，代替方案案例
安卓项目compileSdk为32，在使用startActivityForResult()方法时发现Android studio提示此方法已经废弃了。
2023-03-05 02:08:24
2211
原创 AI热门有趣的免费应用工具和资源分享（部分免费免登录）
AI热门有趣的应用链接整理，上搜集爬取整理了一些AI有趣的工具应用Github Copilot (Copilot 亲测好评)2，stable-diffusion(不用登录)（PS:部分资源来源于B站up Lks的页面。Dall-E-2(dall名气比较大)1，百度飞浆(不用登录)3，五秒复制你的声音。
2023-02-19 20:07:16
2946
原创 Vue3中用自定义指令拦截点击事件,点击事件添加权限
Vue3中用自定义指令拦截点击事件,点击事件添加权限。某些应用场景会给点击事件添加权限，不存在权限就 拦截 点击事件（或触发其他业务事件），有权限就继续正常 触发 点击事件。如果用封装组件的方法，在使用三方UI库的情况下，封装成本过大，并不划算。
2023-02-12 23:08:39
1258
1
原创 event.path参数被浏览器删除，如何一劳永逸的解决
event.path参数被浏览器删除，如何一劳永逸的解决.event.path参最早从官方issue中可获知chromium内核团队早在21年就开始认为 Event.path 属于非标准 API,某些地方已经开始删除event.path数组参数了。2月初，Chrome(版本号109.0.5414.120)在一次升级中删除绑定点击等等部分事件中的Event.path数组参数，,将当前所有的冒泡一层一层 parentNode 元素收集起来。方法，但是根据网上的某些网友反馈也有可能返回空数组（暂未找到原因）。
2023-02-12 01:37:59
851
原创 Flutter监听安卓系统字体变化,监听安卓系统深色模式切换
Flutter监听安卓系统字体变化；安卓系统深色模式切换Flutter通过强大的MediaQuery控件做到监听前设备的信息及其设备信息的动态变化。
2023-01-27 22:24:15
593
原创 Could not locate aapt. Please ensure you have the Android buildtools installed
Could not locate aapt. Please ensure you have the Android buildtools installed.Exception: Problem building Android application: see above error(s)
2023-01-27 16:02:01
1230
原创 To use this template, you must update following to modules:npm xxx should be xxx
To use this template, you must update following to modules: npm: should be >=
2023-01-04 00:02:05
357
原创 [vite] Internal server error:options.devServer.transformWidthEsBuild is not a function...
[vite] Internal server error:options.devServer.transformWidthEsBuild is not a function...
2022-09-11 15:40:36
1258
原创 Vite如何打包分割代码
Vite配置如何优雅的code spliiting代码分割前端生态 rollup 和 webpack都有的概念。如果把所有代码都打包到一起，可能最终的代码非常大。从而影响加载时间。而且，很多代码是初始加载时，不需要的。因此，我们可以根据代码使用的紧急程度，将代码分割打包后，可以按需加载。.........
2022-08-28 21:01:23
9974
1
原创 Vue3中的teleport节点传送
Vue3 teleport官方文档地址：Vue3中的teleport API极大方便了在Vue3业务逻辑中操作移动Dom位置。
2022-06-22 00:29:04
164
原创 Vue3中的Composables组合式函数,Vue3实现minxins
Vue3中的Composables是什么Vue3中的Composables 简单理解其实就是类React Hooks式的组合式函数封装方法。Vue官方称为Composables 组合式函数。（1）Vue2 中的mixins混入器写法缺点 (Vue3 optionsApi写法同理)新建minxins.js文件 案例使用组件一个简单Vue2 (或Vue3optionsApi写法) minxins混入器案例很直观的看出 缺点:使用一个简单Vue3 composition API案例，写类Hook
2022-06-12 03:54:28
3522
1
原创 Vue3源码中的TypeScript重载函数的作用
TypeScript重载函数的作用案例C++中的一个概念(百度百科):函数重载一般指重载函数。 重载函数是函数的一种特殊情况，为方便使用，C++允许在同一范围中声明几个功能类似的同名函数，但是这些同名函数的形式参数（指参数的个数、类型或者顺序）必须不同，也就是说用同一个函数完成不同的功能。这就是重载函数。简要总结就是函数的名称相同, 但是参数不同的几个函数, 就是函数的重载。1.Vue3 ref声明方法的源码中重载函数案例2.举一个应用场景中的案例缺点function ToAdd (a: s
2022-05-30 00:30:04
265
原创 写TS效率大提升,TS常用内置工具类Omit、Pick、Partial、Required、Readonly、Exclude 、Extract、ReturnType、NonNullable
TS中常用的工具映射类型,让写TS时效率大大提升,避免无意义的重复性定义。1.Omit 省略/剔除顾名思义 可以剔除 已定义对象中 自己不需要的一部分形成新的定义类型。interface UserObj { readonly name: string; // readonly 只读属性 只能初始化定义 不能二次赋值 age: number; id: number; sex: 0 | 1; address: string; weight: number;
2022-05-29 02:25:09
3821
2
原创 TypeScript type 和 interface区别
在使用ts的type 和 interface时两者作用(简单案例)interface只能定义对象数据结构类型。// 简单案例1interface User { name: string; age: number; sex?: string;}let user: User = { name: '', age: 233};// 简单案例2interface User1<T> { name: string; age: nu
2022-05-22 02:29:09
4041
1
原创 js统计对象的层数
js算法统计对象的层数// 测试数据var testObj = { b: { c: { d: { e: {} } }, c: { d: { e: { d: { a: { b
2022-05-04 01:45:35
644
原创 Failed to load module script: The server responded with a non-JavaScript MIME type of “text/html”.
vue3+vite打包以后，项目切换路由触发（偶发触发）报:After using vue-router, there is an error in packaging and running # Failed to load module script: The server responded with a non-JavaScript MIME type of “text/html”. Strict MIME type checking is enforced for module scripts
2022-05-01 03:34:04
16251
9
原创 Vue3+ElementPlus el-date-picker 时间范围设置 固定时间段可选 配置
vue3 template 部分 <el-date-picker v-model="value1" type="daterange" range-separator="To" :disabledDate="disabledDateFun" start-placeholder="Start date" end-placeholder="End date" />vue3 逻
2022-04-06 00:34:30
8416
1
原创 react-router v6嵌套路由简单案例
react-router V6版本路由用法和V5用法差距较大,接一个简单的使用案例新版本组件也开始使用函数式组件+hooks"react-router-dom": "^6.2.1",1.入口mainimport "./App.css";import { BrowserRouter, Route, Routes, Navigate } from "react-router-dom";import Index from "./modules/index/Index";import E.
2022-03-13 02:09:29
1502
原创 js让forEach停止的方法
可以利用 try catch 的抛出异常行为来巧妙的停止forEach遍历开发中当然不能这么写 面试的时候 可以说出来 也算加分项```// 必须用 try catch 整个包住forEach 才能停止try { [1,2,3,4,5,6].forEach(function(item, index){ console.log(item); if(item === 3){ throw new Err...
2022-02-13 13:14:30
2140
原创 Remove untracked files, stash or commit any changes, and try again
在react 项目中暴露webpack 配置文件的时候，执行yarn run eject报错Remove untracked files, stash or commit any changes, and try again.error Command failed with exit code 1.info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.其实就是因
2022-02-01 02:02:59
1343
原创 JOSN.parse(JSON.stringify())实现深拷贝的缺点
首先推荐在项目中引用lodash三方工具库cloneDeep方法用来做数据深拷贝。// import { cloneDeep } from 'lodash';import cloneDeep from 'lodash/cloneDeep';// 只引用一个 推荐这样写let a = cloneDeep(1);案例数据var obj = { name: 'zhangsan', date: new Date(), regExp: new RegE
2022-01-23 21:55:56
2198
1
原创 Failed to parse source for import analysis because the content contains invalid JS syntax
Vue3 在采用 compositionAPI 时候,Vite编译报错:[vite] Internal server error: Failed to parse source for import analysis because the content contains invalid JS syntax. If you are using JSX, make sure to name the file with the .jsx or .tsx extension.我遇到的报错原因是因为
2021-10-01 20:00:29
5153
原创 Redux及React-redux的简单使用
在react项目中使用redux的简单案例1.安装reduxnpm install redux --save2.使用redux store目录文件分配
2021-08-07 23:19:18
209
原创 mobx6使用案例
PS:mobx6版本以后官方不建议使用@observable装饰器了 可看官方案例https://mobx.js.org/the-gist-of-mobx.html脚手架 create-react-app目录 一、安装二、配置package.json三、定义mobx的store四、在页面中使用mobx,并且通过action 改变mobx一、安装//npm yarn 随需求，尽量不要混用，混用有些资源可能会出现掉包yarn add mobxy...
2021-07-08 23:46:41
982
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人