自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(39)
  • 收藏
  • 关注

原创 ERROR context.outputFileSystem.lstat 报错原因

从上面的报错来看大致是在使用Webpack打包工具时和nuxt依赖有关,然后去看了package.json里的版本和下载的依赖版本是否有差异....在JavaScript的包管理工具npm中,~(波浪号)和^(插入符号)是用于指定依赖版本范围的符号,它们有不同的含义在JavaScript的包管理工具npm中,~(波浪号)和^(插入符号)是用于指定依赖版本范围的符号,它们有不同的含义。

2024-08-28 09:43:41 186

原创 vue2自定义-多选下拉框

vue2自定义多选下拉框。这是一个多选下拉框的组件,简单弄了一个样式,后续有时间可以会加一下动画效果啥的,现在将就着用先。通过父组件传入数据可以实现多数据多页面的复用。感兴趣的可以直接跑一下。

2024-08-26 17:21:56 233

原创 前端性能优化-实测

今天测试网站性能的时候发现一个问题,一个h2标签内容为什么会占据这么长的渲染时间,甚至有阶段测到占据了7000多毫秒,使用了很多方法都不能解决,包括了修改标签,样式大小等,当我把它彻底删掉才没有出现这个问题,但是这个地方是不能删除这个标题的,以至于一直卡在这个地方并将我的性能评分卡在30-40内。首先这个网站字体样式使用了字体包,在未下载完字体包时阻碍了页面的显示,这就是为什么单这个标签的内容就渲染了这么久。解决方式也很简单,在使用字体包的引入中使用。属性,这个属性特别适用于自定义字体加载时的用户体验。

2024-06-27 16:58:53 182

原创 VSCode运行前端项目-页面404

发现打开的页面重定向到404:http://19x.xxx.x.xxx:9803/404;打开CDM输入:netstat -ano|findstr "9803"再输入:netstat -ano|findstr "9803"就输入:cd c:\WINDOWS\system32\。输入:taskkill /F /pid 5528。执行完上面的步骤,重启一下项目就可以了。找到后面4位数的进程号通过命令结束进程。

2024-06-25 15:10:23 398

原创 解决Chrome浏览器打开flags页面时出现黑屏问题的方法

当我们在使用Chrome浏览器并尝试访问flags页面时,遇到屏幕短暂闪烁或变黑的情况,这可能与启用的硬件加速功能有关。硬件加速是Chrome浏览器的一个功能,旨在利用计算设备的GPU来提高视频播放和图形渲染的性能。然而,在某些情况下,这个功能可能导致不稳定性,尤其是在播放视频时,可能会经历短暂的黑屏、黑块或屏幕闪烁,可通过在设置页找到硬件加速选项,进行关闭后重试(重启浏览器或电脑),如果还是没有解决就用下列方法解决。最后可以设置一下屏幕的高性能模式,进入设置->系统->屏幕->显示卡->图形设置;

2024-03-29 16:45:38 1240

原创 按需自动加载 Element Plus 实测

按需加载是一种优化策略,可以提高前端应用程序的性能、用户体验和可维护性。在使用 Element UI 或其他大型 UI 组件库时,通过按需加载可以最大程度地发挥其优势,确保应用程序的性能和可扩展性得到有效的管理;我们解决完unplugin-auto-import之后出现的第二个报错提示,我们也是通过执行执行降版本回退的形式进行解决;减少初始加载时间,降低资源占用,优化用户体验,灵活性和可扩展性,节省带宽和资源成本等。这有可能是我们的插件版本过高导致的报错提示,执行回退版本到0.16.1;

2024-03-29 09:26:33 798

原创 computed计算属性的妙用!!!

vuejs的computed熟悉吗?有效的做好页面结构的优化呢?经过简单的两个操作就可以做到让页面更加整洁,也更好维护,这就是计算属性的魅力。1.首先遍历出页面结构,使页面更加整洁,也更方便后期的维护...

2024-03-21 17:54:43 140

原创 Element-Plus Dropdown 下拉菜单样式修改

Element框架是我们开发最常用到的一款UI框架,现在就直接演示怎么解决,el-dropdown 下拉菜单样式....亲测有效。

2024-03-21 11:32:00 1438

原创 修改el-progress进度条颜色为渐变色

【代码】修改el-progress进度条颜色为渐变色。-- 附源码

2024-03-20 21:05:38 1343

原创 text-wrap: nowrap; 无效属性的解决方式

在CSS中,text-wrap 并不是一个标准的属性,可能是一个错误的属性名或者是特定库或框架的扩展属性。如果你想要控制文本是否换行,可以使用w...

2024-03-07 15:11:30 1606

原创 vue3+element-plus el-input 自动获取焦点

虽然element有提供input的autofocus属性,但是当我们第二次进入页面就会发现autofocus已经不再生效,需要通过onMounted去触发input的focus解决这个问题。

2024-03-07 10:00:49 3374

原创 Vue+Clipboard.js 的使用

Clipboard.js是一个JavaScript库,用于在浏览器中实现复制和粘贴功能。它提供了一种简单、可靠且跨平台的方式来处理剪贴板操作。使用Clipboard.js,你可以轻松地将文本或图像复制到剪贴板,并在需要时从剪贴板中粘贴内容。它支持多种浏览器,包括Chrome、Firefox、Safari和Edge等。到这里就完成了对Clipboard.js的一个基本使用了,其他功能可以直接访问。1.安装Clipboard.js库;

2024-03-05 10:28:19 702

原创 Nuxt2+Vue2 使用Elemenet-Ui

在Nuxt的项目中如何使用ElementUI?简单三步教你如何在Nuxt项目中使用Element-Ui...

2024-02-28 15:03:32 609

原创 swiper@5.2.0的使用

1、项目中添加插件:yarn add swiper@5.2.0。4、基本配置和初始化。

2024-02-06 18:29:14 413

原创 swiper 5.2.0版本,H5出现不能左右滑动切换问题

在上面代码中,如果我们在swiper-wrapper后面还新增了一个自定义的class类名:wrapper_node的话,就会导致H5不能进行左右滑动切换。把自定义的class类名wrapper_node删除就可以了。

2024-02-06 16:54:58 692

原创 nuxt 初始化报错 ERROR Error: Failed to download template from registry: fetch failed

这个时候可能会出现:ERROR Error: Failed to download template from registry: fetch failed。在电脑本地hosts文件末尾添加这行参数:185.199.108.133 raw.githubusercontent.com。当我们想要初始化一个nuxt项目时,执行:npx nuxi@latest init 文件路径:C:\Windows\System32\drivers\etc。最后从新运行就可以了,亲测有效!

2024-02-06 16:40:20 965

原创 如何查看自己的ssh

如果您的密钥文件名不是默认的id_rsa.pub,请将命令中的文件名替换为你的公钥文件名。当我们很久没使用过ssh,怎么去查看ssh呢?1.打开我们的git bash窗口,输入。来查看,找到id_rsa.pub文件。通过上面两步,就能拿到ssh!3.查看公钥,您可以使用命令。

2024-01-11 11:41:38 2354

原创 uniapp开发

优点:可以向指定路径推送消息,打开对应页面,实现与应用内部组件之间的无缝连接;优点:可以在应用程序中重新启动指定页面,并保持之前的状态和数据;需要注意的是,不同的编译器和预处理器可能会支持不同的宏定义,因此具体的支持情况可能会有所不同。缺点:只适用于Tab页间的切换,无法实现页面之间的跳转;优点:可以跳转到任意页面,支持带参数的路由跳转;优点:可以将页面重定向到其他页面,避免刷新整个页面;缺点:跳转时会刷新整个页面,影响用户体验;相比,缺少了页面切换时的动画效果;优点:可以实现快速切换Tab页的效果;

2023-12-22 16:47:48 77

原创 GitHub Actions发布NPM -- 自动部署

关于如何使用GitHub Actions自动部署NPM和过程中遇到的问题,以及解决办法。通过详细步骤截图,让你可以0基础也能完成操作,实现使用github自动部署npm包。

2023-12-22 16:47:15 442

原创 vue项目中使用Cookie

以上是通过cookie简单实现了一个10分钟内免登录的demo。

2023-12-14 15:25:44 641

原创 利用vuex控制公共组件的显示状态

关于如何使用vuex,给公共组件进行通讯的demo.

2023-12-14 13:43:19 458 1

原创 uniapp 苹果支付内购

如果是本地打包,需要在xcode配置,liblib..两个文件,feat?需要在app store 中配置商品信息,并且需要添加银行卡等。需要在uni中manifest.json打开内购开关。案例:(可能会出现丢单,需要特别处理)暂时这样以后更新...

2023-10-09 14:42:54 579 1

原创 canvas图片裁剪demo

【代码】canvas图片裁剪demo。

2023-08-03 14:20:33 134

原创 Uniapp 手动关闭启动页的Splash图

当我们做uniapp项目时,需要做后端控制显示版本,如果使用组件切换实现时就会出现版本UI切换太明显的情况,此时我们可以利用启动页动画的手动关闭的方式进行一个暂时的遮挡,等页面切换完成之后再让启动页关闭,首先进入。做完上述步骤后,直接在代码逻辑中使用以下代码进行关闭启动页动画。等待首页渲染完毕后再关闭Splash图。

2023-08-02 17:33:56 2234 2

原创 jq 选择标题滚动到置顶页面-[源码]

【代码】jq 选择标题滚动到置顶页面-[源码]

2023-06-08 14:52:42 89

原创 点击标题滚动到指定位置

比较直接一点的是使用a标签自带的锚点,如下所示,但是这样进行跳转页面显示的效果会比较生硬;所以我们可以使用scrollIntoView() 方法,该方法会滚动元素的父容器,使被调用 scrollIntoView() 的元素对用户可见。scrollIntoView() 方法不仅可以控制显示位置,还能设置滚动过度时的动画效果,会有比较好的用户体验。如果为 true,元素的顶端将和其所在滚动区的可视区域的顶端对齐。如果为 false,元素的底端将和其所在滚动区的可视区域的底端对齐。behavior 可选。

2023-06-08 14:25:35 758

原创 vue.config.js 基础配置

2.如何在vue.config.js中进行前端跨域。1.如何关闭eslint对代码的判断。

2023-06-07 14:49:16 200

原创 electron+vue报错

3. 客户端或服务器端代码问题:如果客户端或服务器端代码存在错误或漏洞,可能会导致 WebSockets 连接被终止。1. 网络问题:如果网络出现问题,例如断开连接或延迟,可能会导致 WebSockets 连接被终止。2. 服务器端问题:如果服务器端发生故障或崩溃,可能会导致 WebSockets 连接被终止。这个错误通常发生在使用 WebSockets 进行通信时,表示与远程服务器的连接已经被终止。3. 检查客户端和服务器端代码是否存在错误或漏洞,并修复它们。

2023-05-31 15:01:33 859

原创 vue三分钟的倒计时格式为02:59:99

手写一个分:秒:毫秒格式的倒计时。

2023-04-23 14:45:39 398

原创 vue2移动端适配 -- px转rem

postcss-pxtorem 则是一个 PostCSS 插件,它会将 CSS 中的 px 值自动转换为 rem 值,同时也支持指定 px 和 rem 的转换比例、指定不需要转换的属性等功能,让我们可以方便地进行移动端适配。amfe-flexible 是一个用于设置 rem 基准值的库,它能够根据屏幕尺寸动态地调整 rem 的值,从而达到移动端自适应的目的。我们再写移动端网页的使用,当我们拿到750px大小的蓝湖ui图,此时我们该如何让它能和移动端适配呢?此时我们就完成了移动端的适配并让px转化为rem。

2023-04-19 11:39:39 2024 1

原创 JavaScript 操作数组的常用和不常用方法

这个例子中,对于数组中的每个元素,将其乘以2并将其放入一个新的数组中。reduceRight():从数组的右侧开始对数组中的元素执行一个函数,并将结果累积到一个值中。flatMap():对数组中的每个元素执行一个函数,并将结果压缩成一个新数组。reduce():对数组中的元素执行一个函数,并将结果累积到一个值中。filter():根据指定条件过滤数组中的元素,并返回一个新数组。map():对数组中的每个元素执行一个函数,并返回一个新数组。shift():从数组的开头删除一个元素,并返回该元素的值。

2023-04-17 17:54:37 87

原创 关于svn的使用

在一些项目中我们会使用到 TortoiseSVN这个工具。文档中将详细的会教你如何拉取svn项目到本地以及如何提交svn代码。

2023-04-12 14:12:48 16677

原创 关于process.env.VUE_APP_BASE_URL的使用 -- Vue2

是一个 Vue.js 中使用的环境变量,可以用来存储一个应用的基本URL地址,例如 API 服务器的地址。在 Vue CLI 3 以上的版本中,当你在项目根目录下创建一个名为。则是一个自定义的环境变量。这个变量可以在 Vue.js 代码中通过。你可以在 Vue.js 项目的任何地方通过。其中 [mode] 是你的模式名称,例如。的值,那么这个值就会被自动注入到项目中。的值,自动加载对应的环境配置文件,例如。表示当前运行的环境是开发环境。在运行项目时,你就可以使用

2023-04-11 14:31:57 9698

原创 vue项目中如何添加UI给的字体包

在src目录下创建一个assets文件夹用于存放我们的一些样式文件,然后再当前目录下再创建一个fonts文件夹用于存放UI给的字体包:如下所示。在很多项目中我们会使用到UI给我们的特定字体,那我们在项目中如何使用呢?在man.js中引入刚刚写好的public.css。然后再vue页面中就能直接使用了。

2023-04-11 14:05:18 1143

原创 如何在uniapp中使用uView --- 超详细

你还记得在HBuilder中使用uView吗,手把手教你如何在HBuilder中使用uView组件库。

2023-03-29 09:11:06 4995

原创 vue3+element-ui el-collapse折叠面板 箭头方向和位置的修改

关于如何修改elment-ui中el-collapse手风琴组件;在开发中我们经常会对element-ui进行样式的修改,有时候很难找出相对的样式class名称,以下是可以对el-collapse位置和箭头方向的修改class,如样式不生效可以进行添加样式穿透(deep)

2022-12-08 12:37:30 6968

原创 如何修改Git上的名字

【代码】如何修改Git上的名字。

2022-11-09 16:27:06 7581 2

原创 前端环境的安装、IDE选择和配置

0基础配置,前端开发环境!!!

2022-10-18 14:15:49 375

原创 vue2仿轮播--自动切换和点击切换

vue2仿轮播--自动切换和点击切换

2022-10-15 14:56:05 396

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除