- 博客(65)
- 收藏
- 关注
RSS订阅原创 静态资源文件在浏览器中的缓存机制
提要：为什么项目部署上线后，静态文件（vue项目中，放在public中的文件，如common.js）在自己的电脑中没有更新，在其他人的电脑中更新了。考虑到了缓存，在html中添加了no-cache等，检查了network中的response headers中没有设置cache-control，那文件的缓存怎么计算？
2025-03-21 11:40:56
522
原创 nuxt3的页面中怎么获取环境变量以及为什么vite中配置define失效？
在 Nuxt 3 中，已经被所取代，用于管理环境变量和运行时配置。你可以按照以下步骤使用。
2025-01-07 14:22:29
472
原创 完美解决vant浮动气泡+弹出菜单
2. 使用floating-bubble的offsetChange事件，获取当前的x和y，判断当前浮动气泡在什么位置，来修改popover的placement。1. 使用van-floating-bubble包裹van-popover，但点击后只会重复显示不能隐藏。2. popover位置固定，不能根据floating-bubble改变位置。1. 去掉popover绑定的v-model:show，改为使用show属性。需要有一个浮动气泡，点击弹出导航菜单。
2024-09-27 18:02:18
981
原创 项目不是部署在根目录下时，index跳转404页面
背景：vue3的项目开发，部署到测试环境后，页面总是直接跳转到404，本地模拟部署线上环境没问题，模拟部署测试环境后，复现了问题。解决方案：router/index.js中需要进行配置。
2024-08-28 19:38:16
333
原创 vue3(nuxt3)中使用ref获取不到子组件变量
使用的组件是默认关闭的——即通过模板引用或者$parent链获取到的组件的公开实例，不会暴露任何在中声明的绑定。可以通过defineExpose编译器宏来显式指定在组件中要暴露出去的属性。
2024-07-01 17:30:25
672
1
原创 更正：vue3升级nuxt3，server怎么修改
用于处理服务器端请求代理，主要关注服务器端的代理设置。：用于处理前端请求代理，主要关注前端开发时的代理设置。它们在开发过程中可以结合使用，以确保前后端都能正确处理跨域请求和代理需求。
2024-05-14 18:48:12
599
原创 nuxt中使用window报错is not defined
因此，onMounted钩子是确保你的代码在正确的上下文中执行的一种安全机制，它避免了在服务端尝试访问不存在的window对象导致的错误，并允许你安全地使用这些对象在客户端实现动态行为和交互。这种模式确保了代码的可移植性和在不同环境下的健壮性。
2024-04-16 10:44:53
1098
原创 npm install报错 unexpected token
卸载所有版本的node，卸载nvm，重新找到nvm-windows最新版1.1.12，安装后，重新安装所有版本的node。执行npm install，报错：npm ERR!Unexpected token '.'但有用的办法就是好办法，折腾了两天的问题终于解决。node版本：18.10.0。nvm版本：1.1.7。
2024-04-01 11:48:03
320
原创 数组和类数组转换
Array.from 是 JavaScript 中的一个数组方法。它用于从一个类数组对象或可迭代对象创建一个新的数组实例。Array.from 接受两个参数：第一个参数是要转换成数组的对象，第二个参数是一个可选的映射函数，用于对每个元素进行处理。
2024-03-29 11:53:49
512
原创 怎么使用vite自动生成路由——vite-plugin-pages
是一个为 Vite 打造的插件，旨在自动化 Vue 和 React 项目中的路由处理。这个插件通过文件系统的结构自动生成路由，大大简化了路由配置的复杂性，使开发者能够更加专注于页面本身的开发，而不是路由的手动配置。以下是。
2024-03-15 11:04:08
1470
原创 Mac中文输入法区分回车和提交
在Windows下输入拼音后，敲击空格 => 显示第一个联想词，敲击回车 => 拼音显示在搜索框中，再敲击回车 => 跳转搜索结果页。2. 网上简单查了下，event有个属性可以使用——isComposing，而且这个属性只有在keydown事件中会有所区别。在Mac浏览器中，敲击空格 => 显示第一个联想词，敲击回车 => 跳转到搜索结果页。1. 最开始想到的就是阻止默认事件，但是逻辑上行不通，而且实际操作后发现确实行不通。在搜索框中输入关键词，回车跳转至搜索结果页。vue3+vuetify的项目。
2024-03-14 15:00:02
1110
4
原创 vue3项目中structuredClone报错
报错：Failed to execute 'structuredClone' on 'Window': #<Object> could not be cloned。修改：formData不能是ref格式，改为如下。
2023-08-18 04:02:37
3101
2
原创 vue2使用composition-api的情况下想使用route
vue2的项目，使用了@vue/composition-api组合式api，在其他的js文件中想使用$route.query。
2023-08-07 14:42:57
488
原创 前端可以怎么利用AI
推荐系统：利用AI算法根据用户的行为和偏好进行数据分析和处理，为用户提供个性化的推荐内容。例如，电商网站通过推荐系统推荐用户可能感兴趣的商品。数据可视化：利用AI算法对数据进行分析和处理，并以可视化的方式展现出来，例如利用图表展示数据分析结果。自然语言处理：利用AI算法对文本进行处理和分析，例如实现语音识别、语音合成、聊天机器人等应用。图像识别：利用AI算法对图像进行分析和识别，例如通过图像识别技术实现人脸识别、物体识别等。自动化测试：利用AI算法对前端页面进行自动测试，减少测试时间和人力成本。
2023-06-07 18:58:53
1966
原创 前端写一个节流函数
前端节流函数的作用是控制一个函数的执行频率，使得该函数在一定时间间隔内只执行一次。这样可以减少不必要的计算和网络请求，提高页面性能。记录上一次函数执行的时间，每次执行时计算当前时间和上一次执行时间的差值，如果大于等于。使用该函数时，只需要将需要节流的函数作为第一个参数传入即可。，返回一个新的函数。该函数内部使用了一个变量。函数，该函数每隔 1 秒才会执行一次。该函数接收两个参数：要节流的函数。这样就能控制函数的执行频率了。上面的代码会在滚动时执行。函数，但是由于使用了。
2023-06-07 18:57:19
278
原创 spa项目使用插件做预渲染
需求出发点：项目需要做SEO优化当前情况：项目是vue-cli搭建的spa(单页面渲染应用)，即页面查看源代码只有spa对SEO搜索引擎爬取非常不友好，因此需要用到预渲染，将需要做SEO的重点页面进行预渲染使用工具：prerender-spa-plugin...
2022-08-10 18:35:55
382
原创 scss在calc中插入变量
定义一个宽度的变量，好统一修改，但是编译之后，变成了 invalid value ——— calc(100% - $width)，原样输出了。用插入值的表达式，格式：#{$width}
2022-08-04 16:18:20
512
原创 a链接点击后弹出about:blank#blocked页
明明已经加了javascriptvoid(0)，为什么依旧会跳转呢？关于一个曾经困扰我被解决了，过很久之后又再次复活攻击我的事情……a链接点击后弹出aboutblank#blocked页。因为添加了target！
2022-07-26 18:05:43
28087
原创 nvm安装node的国内镜像
默认路径C//Users/Administrator/AppData/Roming/3.保存，使用nvminstall【node版本号】，即可安装node啦。需求场景居家办公使用家里电脑，发现用nvm下载不下来node，提示超时。
2022-07-18 18:29:37
2170
原创 swiper动画效果effect不生效
设置了effect后不生效，看了半天原因，源码也看过来了，以为配置项有什么问题，或者是什么方法没有调用到。试了下用鼠标拖拽有效果，可是自动轮播的时候effect效果就没有了。结论：speed设置为0了！不知道谁干的好事……...
2022-07-14 16:20:54
3131
原创 部署报错$notify
报错：Subsequent property declarations must have the same type. Property '$notify' must be of type 'ElNotification', but here has type 'Notify'.我们的项目是推送到线上后自动部署的，部署报错，看了下日志，大致报错如下：ERROR in D:/work/项目名/node_modules/vant/types/notify.d.ts(37,5):37:5 Subs.
2021-12-23 16:30:13
1282
原创 Vue2中，swiper6的箭头不生效
swiper版本：6.3.5解决：1.main中// navigation是箭头的重点import { Swiper as SwiperClass, Pagination, Navigation, Mousewheel, Autoplay} from 'swiper/swiper.esm'SwiperClass.use([Pagination, Mousewheel, Autoplay, Navigation])2.vue中（箭头放在轮播外面）<swi
2021-12-22 10:28:14
2750
原创 react-bootstrap tabPane
最近修改 superset 的项目，各种坑各种踩。本以为我以后用不上 react 框架了，没想到修改这个项目的源码，赶上了 react。这次的坑来源于这个需求：superset做移动端嵌入，在 tab 标签切换到别的再切换回来的时候，希望还能保持原本的滚动位置。我考察了一下发现滚动位置互相扰乱的原因是，滚动的是html元素，也就是这个页面整个是滑动的，所以切换到别的 tab，虽然切换完的没有滚动，但还是保留了上一个的滚动位置。闲话不多说，修改思路：tab 切换的时候记录下 html 的 scro
2021-11-04 16:10:00
569
原创 echarts-sampling降采样
今天修改一个echarts的渲染效率问题。首先修改请求数据的问题，原先的逻辑是点击的时候请求数据，我看了下数据大概有七千多条，请求耗时是1.6s-1.7s，这是在我的电脑上。同事反馈在他的电脑上需要5s以上。于是修改逻辑为：在“分时”的时候就请求“日”和“周”的数据。这样一来优化了请求的时间，渲染图就不会出现长时间留白。其次修改：echarts图渲染的时候会有卡顿的情况，查了下echarts官方配置项，有一个sampling可用，是降采样，也就是渲染的时候不把每一个点渲染出来。e..
2021-09-08 18:16:32
9836
原创 windows系统下操作nginx的命令
启动nginx(在nginx文件夹下) start nginx 这个有点鸡肋，因为毕竟已经到文件夹下了，直接双击nginx.exe就ok了重启nginx(在nginx文件夹下) nginx.exe -s reload杀死nginx taskkill /f /im nginx.exe(在nginx文件夹下) nginx -s stop(快速停止nginx)(在nginx文件夹下...
2021-09-07 18:51:44
438
原创 superset前端项目无法启动，报错jsx中有无法解析的token，没有合适的
报错忘记截图了……You may need an appropriate loader to handle this file type, currently no loader …大致意思就是，没有合适的loader去加载这类文件，报错集中在src目录下的jsx文件中。解决：webpack.config.js文件，include中添加src目录{ test: /\.jsx?$/, // include source code for plugins, but excl
2021-08-31 13:33:38
3069
2
原创 pdfjs预览pdf报错
跳转之后的页面已经可以出来，blob生成的链接也是有返回的，但是预览是空白，并且控制台警告：Warning: Invalid stream: “FormatError: Bad FCHECK in flate stream: 120, 239”跟到源码里面看警告的原因，应该还是解析出了问题。解决方案：axios请求文档流时候的responseType改为blob// 原本这里写的是this.$axios.get(`/api/preview?id=${id}`)// 后来发现问题就在这里，
2021-08-20 10:27:02
7160
原创 npm install报错node-sass
npm i node-sass --sass_binary_site=https://npm.taobao.org/mirrors/node-sass/
2021-08-20 10:16:35
277
原创 调整后台传回来的数据使其满足echarts结构
今天收到一个需求，是和echarts有关的，不过并不是调整echarts，而是传给echarts的数据要做调整。// 从后端接收到的数据类似这样：[ {statename: 'a', value: 1}, {statename: 'b', value: 2}, {statename: 'c', value: 3}];// 需求的echarts图需要的数据是这样滴：[ {statename: 'a', value: 1}, {statename: 'b
2021-08-02 15:57:11
487
原创 谷歌浏览器更新后，缩放会使table的td边框线不一样粗
今日正常发版后，测试同事反映表格的边框线不一样粗细，我在本地没能复现，缩放也没能复现。问了下同事谷歌版本：91，自己的浏览器版本：90。试了下把自己的浏览器更新到91后复现了这种情况。在网友的启发下的解决方案：发现是border-collapse出现了问题。第一步：去掉border--collapse，改成separate第二步：给table添加border-spacing: 1px;background-color: #000;第三步：去掉td的border大功..
2021-06-28 18:16:52
3493
10
原创 http referer
今天同事问一个比较奇怪的问题。我们这边的项目中，有个地址，要单点到客户的系统中，具体什么不用做，只需要跳转到客户处理单点的一个链接就行，链接地址类似于这样： http://ip/ssoLogin..
2021-05-31 19:39:48
239
原创 放个链接，今天碰到的，感觉能用上
http://www.windowfdb.com/为啥会搜到这个网站呢，起因是从想从SVN的历史记录中复制出来上次提交的文件，结果没能复制出来，反而弄成了导出文件。整个文件夹导出来就太多余了，但是让人抓狂的是：这个文件夹删不掉了！总是提示“文件/文件夹被占用”，不能删除。我特喵的就导出了一下，还什么都没干呢，就不能删了……网上找了下想删除这种被占用的文件（夹）怎么删掉。1.找到任务管理器，打开资源监视器2.在CPU页签下，有个搜索句柄，把要搜索的文件（夹）名输入，就能查到相关情况，右
2021-03-30 10:25:54
517
2
原创 word将乱序文档编成顺序 & 去掉自动编号保留序号为字符串
今天鼓捣了个不太了解的东西，office-word给朋友捣鼓一个word文档，文档内容是给学生出的题库（嗯，朋友是个老师），从不同的文件中粘过来的题，所以文件中的序号不是按顺序来的。检查了一下word，发现需要做的事情是这几点：1.按规律查找到所有序号2.替换当然过程离不开百度，我本人对office的软件用的不是很熟练。第一步：找到文档空白处，插入-文档部件-域第二步：选择AutoNum，选第一种就行，然后“确定”第三步：确定之后，文档里应该会出现这个..
2021-03-09 15:38:27
3399
原创 关于前端日期的一点小记
今天看前端本地存储的文章时，看到cookie，就想再加深学习一下cookie。打开MDN找到cookie一节，看到设置expires时，里面提到世界末日，秉承一颗好奇的心，点开了世界末日2038(有兴趣的同学自行百度)，一路捋到了“千年虫”问题(有兴趣的同学还是自行百度，本人太懒，不粘贴了)。对于永久cookie我们用了Fri, 31 Dec 9999 23:59:59 GMT作为过期日。如果你不想使用这个日期，可使用世界末日[Tue, 19 Jan 2038 03:14:07 GMT]，它是32位带
2021-02-24 11:36:17
181
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人