- 博客(32)
- 收藏
- 关注
RSS订阅原创 vue动态路由简单记录
使用动态路由，将文件分为3份，baseRouter.ts, dynamicRoute.ts, index.ts,新建router文件夹，创建以上3个文件。vite框架使用，不然在动态路由中直接引用组件打包后会导致动态组件页面不显示。dynamicRoute.ts 动态路由逻辑。在登陆之后或者判断获取到用户信息之后重置路由。baseRouter.ts 配置基础路由。原有路由文件 ./router.ts。index.ts 文件配置。
2024-07-05 15:49:33
264
1
原创 css 记录元素选中时会显示蓝色背景
在开发过程中，框选图片上的一部分时，有时会遇到整张图片都成蓝色，影响体验。添加 user-select：none;
2024-07-05 15:28:01
148
原创 vue2 composition-api setup 中使用vue-router、vuex
记录如何在vue2中组合式api中使用vuex以及vue-router。封装为vue3中使用vuex的类似方法。
2024-04-26 18:15:38
386
2
原创 vite + vue 二级域名部署遇到的问题
index.html 中的链接自动加上了/basePatn/前缀，组件中的html部分，静态图片链接没有加上前缀，js部分文件没有加上前缀，css部分文件背景图片都加上了前缀。原因就是所的图片和文件都放在了静态文件夹public/assets中,引入使用的是绝对路径 /assets/xxx/xxx;js部分中需要引入静态文件，如图片，json文件等，在前面拼接上 import.meta.env.BASE_URL，如。解决方案，组件中的html部分图片链接使用别名，如。nginx 部分配置。
2024-04-25 19:14:38
473
原创 h5页面滑动触发浏览器内置功能
开发移动端页面时会遇到按钮滑动（如登录页面验证码滑动验证），上线后会触发浏览器的内置功能（如左右滑动导致切换上一页/下一页）。这样会导致滑动功能失败。
2023-11-22 11:40:43
146
原创 计算两个日期时间差，转化为天 小时 分 秒显示
项目中有时会遇到需要将两个时间的差值换算成天，小时，分，秒这样的文字显示。简单思路：先算出天数，然后减去天数算出小时，如上接着算出分，秒，最后拼接
2023-10-19 17:20:47
369
原创 闭包简单理解
当内部函数引用外部函数的变量时，会从当前作用域开始向上查找，直到找到该变量为止。闭包的主要特点是内部函数可以访问外部函数的变量和参数，而这些变量和参数对于外部函数来说是私有的，不会被其他函数所访问。需要注意的是，如果闭包中引用了一个对象或数组，并且在内部函数中修改了该对象或数组的属性，那么外部函数也会受到影响，因为闭包和外部函数共享同一个对象或数组。闭包是指在一个函数内部创建另一个函数，并且该内部函数可以访问外部函数的变量和参数，即使外部函数已经执行完毕并返回了，内部函数仍然可以访问这些变量和参数。
2023-04-23 17:02:01
90
原创 js校验数据类型
复杂数据,typeof 运算符可返回以下两种类型之一：function, object。typeof 运算符把对象、数组或 null 返回 object，不会把函数返回 object。typeof 运算符可返回以下原始类型之一：string,number,boolean,undefined。js校验数据类型常用的3种方式，typeof运算符、constructor属性和 Object.prototype.toString。可以区分数组，对象，Date, 函数。但是null,undefined会报错。
2022-12-27 11:52:50
576
原创 前端发布订阅
前端开发中，使用vue开发的时候，多个组件之间进行事件通知的场景下还是比较有用的，通过监听事件和触发事件，可以在订阅者和发布者之间解耦。下面实现一个比较简单eventBus。创建一个EventBus类，包含on,off,emit函数。
2022-12-22 18:29:26
83
原创 parseInt函数的一个小问题
parseInt(string,radix)方法，其中string：要被解析的值；radix是 2-36 之间的整数，表示被解析字符串的基数。做舍入操作提取整数（只返回字符串中的第一个数字。如果第一个字符不能转换为数字，parseInt() 返回 NaN）这样一个简单的函数，然而在项目使用中遇到了一个问题，当对一个特别小的数字取整时获取到的值不对。所以使用parseInt时需要注意，可以是Math.floor()代替。需要注意的是 10不是默认值，最常见的值是2，8，10，16。为什么会出现上面的情况呢。
2022-12-19 16:52:50
123
原创 js 接口请求失败重复请求
下面是重复请求的函数，返回一个promise。主要思路：使用while循环，内部使用try catch。当请求失败时，times 值不为0就重新开始循环，请求成功就结束循环。前端开发中可能遇到的一个情况，要求一个api接口请求失败后重复再调用，并且规定调用的次数。如上，简单的一个失败重复请求就完成了。
2022-10-12 16:15:46
3191
原创 husky prettier pretty-quick简单配置
prettier 是代码格式化工具，利用git的hooks机制，在提交commit时自动调用 pretter 进行格式化。实现这一点，还需要 Huksy、pretty-quick 这两个工具。husky 则是社区常用的 git hook 工具，能够在 git 进行一些动作（如 commit/push）时自动执行一些 node script。 husky官网pretty-quick 在更改的文件上运行Prettier,是常见的两种格式化辅助工具。pertty-quick地址prettier简单配置地址per
2022-06-16 14:25:44
2198
原创 在另一个async 函数调用 async 函数
async 函数返回的是一个promise对象，所有在另一个async函数调用 使用await， 等上一个async函数异步执行结束之后再执行后面代码const sleep = (ms) => { return new Promise((resolve, reject) => { setTimeout(resolve, ms); })}const test1 = async () => { for (let i = 0; i < 5;
2022-05-07 10:56:30
1671
原创 vue-cli项目中的跨域问题
vue-cli项目中的跨域问题一、开发环境中的跨域vue-cli创建的项目中，前端开发测试中，常会遇到跨域的问题。跨域通常都需要后台配置，不过前端也可以处理，可以直接利用 Node.js 代理服务器，通过修改 proxyTable 实现跨域请求在config文件夹下的index.js配置中 dev: { // 静态资源文件夹 assetsSubDirectory: 's...
2019-12-14 11:03:42
159
原创 上传图片到七牛云
上传图片单张图片到七牛云用的是vant-ui 的<van-uploader :accept='"image/*"' result-type="file" :after-read="afterRead"> 上传图片</van-uploader><!-- result-type="file" afterRead获取的file中只有File内容， 具体配置可查看...
2019-12-10 16:15:50
697
原创 js获取各种屏幕的宽度和高度
1.Javascript网页可见区域宽： document.body.clientWidth网页可见区域高： document.body.clientHeight网页可见区域宽： document.body.offsetWidth (包括边线的宽)网页可见区域高： document.body.offsetHeight (包括边线的高)网页正文全文宽： document.body.scro...
2019-11-25 11:08:02
1351
原创 前端微信支付
在微信浏览区内微信支付的两种方式一、在微信浏览器里面打开H5网页中执行JS调起支付注意：WeixinJSBridge内置对象在其他浏览器中无效。getBrandWCPayRequest参数以及返回值定义：1、网页端接口请求参数列表（参数需要重新进行签名计算，参与签名的参数为：appId、timeStamp、nonceStr、package、signType，参数区分大小写。）具体详情可看微...
2019-10-24 17:14:17
466
原创 数组的一些常用方法
数组的一些常用方法检测数组if(value instanceof Array){ // 对数组执行某些操作}instanceof操作符的问题在于，它假定单一的全局执行环境。如果网页中包含多个框架，那实际上就存在两个以上的全局执行环境，从而存在两个以上不同版本的Array构造函数。如果你从一个框架向另一个框架传入一个数组，那么传入的数组与在第二个框架中原生创建的数组分别具有各自不同的构造函数...
2019-10-22 13:49:30
117
原创 koa路由和提供静态服务
koa的路由1.使用koa-router包，npm i koa-router -S2.新建app.js , routes/home.js 2个文件3.app.jsconst Koa = require('koa');const app = new Koa();const home = require("./routes/home");const static = require("k...
2019-09-04 11:42:32
568
原创 简单使用koa
一、koa的简单使用1.安装koa： npm i koa -S2.中间件机制、请求、响应处理const Koa = require('koa')const app = new Koa();// 中间件app.use(async (ctx, next)=>{ console.log(1); await next(); console.log(4); const r...
2019-09-04 10:45:28
116
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人