- 博客(55)
- 收藏
- 关注
RSS订阅原创 关于新手学习React的一些忠告
现在网上的知识真的太多太杂了，比如在B站，你要想学react你能找到一大把视频资源，而且标题起得一个比一个夸张，每个都说自己是最好的，一个视频动辄48个小时，但是你要花的时间远远不止48个小时，因为你看了视频不可能不思考，总要停下来学着敲一敲，直接要源码并不是一个很好的建议，也许是拿来参考可以，但是如果仅仅只是拿来看的话，还是免了，真不如自己上手敲一遍，所以实际要花的时间远远不止于此。下面给出相关链接，如果能帮助到初学react的朋友就太好了，少走些弯路好啊。
2024-12-29 22:19:54
380
原创 最好的Vue组件库之Vuetify的入坑指南
本文是vuetify的入门向文章，想向那些想入坑Vuetify的前端新手或者嫌文档太长不知如何入手的人提供一些浅显的建议而已，能让你们稍微少走一些弯路就是本文的目的
2023-02-02 23:48:00
12167
13
原创 写了个tooltip的切换动画，个人感觉比一些组件库的渐变动画好看
而且用opacity来做动画的好处是，只使用transition就已经可以看到过渡效果了，而且用了绝对定位也不会占用其他元素的空间。最近修改了个语言切换框的tooltip的切换动画，感觉比element-plus或者其他组件库的tooltip的切换动画好看一些，看起来比较灵动，下面将代码分享出来。代码就是上面这些，唯一需要注意的地方就是，初始情况下，.languageList的。以后要是做出一些比较有意思的东西也会放到git上，敬请关注。这两个属性，也能出现过渡动效，但是往往让人最容易能想到的。
2022-12-15 00:14:17
676
原创 关于Twitter Card的一个巨坑
朋友们，相信你们看到这篇博客，大概率都是个前端，肯定是要搞社交平台的分享接口，所以难免要分享到Twitter，直接使用文本分享肯定没有那么吸引人，加上图片的话，据统计可以吸引40%多的人点击链接，可见推广的效果是优于文本的。好吧，废话不多说，看到这篇博客的人都知道它是个啥，所以我就来说说这个巨坑到底坑在何处。。。 如上图所示，显示的错误是： ERROR: Failed to fetch page due to:...
2022-04-15 17:31:04
1892
8
原创 对于Vue中插槽的理解（绝对保证通俗易懂）
本文的内容全部来自于官方文档，例子是自己写的，可以加深理解，语言通俗易懂，自己忘记的时候也可以来查看。 以前看到插槽头都大，心想这tm都是什么玩意儿，什么slot，烦死了。也怪我之前没有认真静下心来学习它，当时学不进去，觉得插槽真的好麻烦，绕来绕去。然而静下心来一学习，发现并不是那么回事。其实插槽的使用非常简单。下面来一一介绍官方文档中的几种情况，已经对应自己举出来的简单例子，和自己的理解，便于之后返回来看。以下的内容都可以对应官方文档来查看。...
2022-03-08 19:01:54
5855
8
原创 提升vue项目首屏加载非常牛逼的一个配置
如果你是vue-cli3的话，在vue.config.js中添加以下的配置：让productionSourceMap为false，这样的话打包之后的assets中的js文件夹就不会生成map文件， 简言之，这个map文件是为了帮助你在生产环境中定位错误的地方的（你想想，在浏览器的console中报错的时候，错误的右边是不是有个这个错误的出处？），设置为false的话，错误的出处就不会是具体的哪个文件的哪一行，而设置为true的话就会定位到具体的某个文件的哪一行。那么，这样设置的好处..
2022-03-08 18:09:54
702
原创 video.js都支持哪些格式的视频呢？
之前想使用一下video.js，定制播放器的一些样式，但是之后发现有些格式是不支持的，在网上也找不到自己想要的答案，但是之后看源码，源码给了我答案。下面是video.js所支持的所有格式的视频：当时产品经理说要做一个可以边加载边播放的效果，然后我就说用一下video.js，然后给我的视频发现还不支持，最后自己才找到video.js支持的格式的。可是转念一想，原生的video就是边加载边播放的。。。然后我便没有继续使用video.js，此需求之后也没有进行了。至于上面有图片的格式，我...
2022-03-08 18:04:14
12055
1
原创 element-ui的el-dialog要如何更改弹出动画？
问题描述：用过el-dialog的都知道，它自身带的弹出动画，是距离顶部比较近，然后出现的很急促，观感上并不是很好。解决办法:如图所示，红框处要写的是你的dialog的custom-class，这个效果我自己写的，虽然简单，但是挺不错，就是缩放，比原本的那个舒服多了，大家可以去试试。vue项目(这里指的是vue 2.*)要修改element-ui的组件样式的话，要去App.vue中修改。⚠️注意：初始的el-dialog带有默认样式margin-top：15vh; 所以看起来距离顶部较近
2022-01-27 19:17:25
5266
5
原创 关于video标签的巨坑
事情是这样的，请求第一页的资源的时候，第一个位置是个视频，现在视频的src是写在video的source中的，第一个位置：但是切换到下一页的时候，下一页的数据的第一个位置也是视频，但是页面上显示的还是之前的，打开调试工具看，可以发现source标签的src属性已经是新的链接了，但是显示的还是之前的视频。原因：经过搜寻资料发现，是source的问题，如果是这种动态替换video标签的source的src的行为，虽然链接会被成功替换上去，但是浏览器不会再去发送一个...
2022-01-27 18:59:21
1153
原创 el-button点击了按钮之后，将鼠标移出按钮，会出现保留点击的状态
于是会出现下面这种情况：按钮居然被选中了。。。。。。解决办法：用性命担保可以完美解决！
2021-11-26 17:26:21
1812
1
原创 对于popover里面的div样式无法修改的问题
（巨坑，找了好久解决办法！）原因分析：因为element-ui的组件与App.vue是平级的，所以在引用了element-ui组件的vue文件（vue组件）中的style中直接修改element-ui比如popover的样式是无效的解决办法：把样式直接写到App.vue中就可以了，注意，如果有多个popover组件，最好用poper-class，这样就能根据不同的popover组件设置样式了...
2021-11-26 17:18:01
1274
原创 vue项目中该如何引入自定义字体？超简单几步教你实现
在这里斗胆说一句教你实现，其实是我的一种实现方法，觉得十分简单，很好理解，所以在这里分享给大家了。具体操作1.在assets中创建一个文件夹，比如叫fonts（或者是其他乱七八糟的名字都随便，都可以）2.将字体文件引入这个fonts文件夹3.在fonts文件夹中创建一个css或者less文件，然后一定一定按下面的方式，字体才能够正确显示:这里有一个坑：注意，在font-family那里，不要按照google fonts里的那种写法，加一个cursive，那...
2021-11-26 16:47:03
4161
原创 vue在使用v-if和v-show的时候要注意的地方
使用v-if和v-show的时候要注意，双引号中判断的变量必须是boolean类型才可以写成如下的形式：v-if=“isShow”很有可能在data中传入的变量根本不是boolean类型的，而是string类型的，但是它的值是true或者false。也就是说，一个变量isShow，它的值可能是： isShow == ‘true’所以这个时候，使用v-if的时候就要写成：v-if=“isShow == ‘true’”打完收工 ～～～...
2021-11-26 16:41:14
947
原创 获取session中的值的时候的一个巨坑
比如设置了某个在session中的变量的值为null，但是在if中判断的时候，应该如何写呢？错误的写法：正确写法：
2021-11-26 16:39:14
246
原创 关于vue全局变量的几种使用方法说明
这几种方法都是亲手实验过到底好不好用的，大家可以参考下：1.写一个js文件，或者vue文件，把全局变量写到里面，然后挂载到Vue.prototype上面去，在main.js中引入包含全局变量的文件。这种方法的致命问题：就是main.js是入口文件，第一次使用这个全局变量当然没有问题，但是当你刷新页面的时候，由于又重新创建了vue实例，之前为全局变量设置的值就会消失。网上似乎有监听它变化然后赋值到local或者session中然后再重新赋值回去的方式，我没试过，不予评价2.写到session中
2021-11-26 16:35:55
1952
原创 当使用this.$notify的方式写element-ui的通知的时候，怎么设置里面的html标签的样式？
解决办法不废话了直接上图了：然后到App.vue中设置样式：显示效果：完美解决！！！
2021-11-26 16:30:05
798
原创 swiper的默认箭头样式要怎么更改？
最近在项目中使用到了轮播图的轮子swiper，但是下面的自带箭头真的是丑爆了：是这种蓝色的，极其丑修改的办法：先给上siwper的代码：在最外层的wrapper中加入以下的样式：让导航的箭头的size为0接下来自己去网上找个箭头的图，比如iconfont，像下面这样就行了：即箭头的图片当作背景图就好了最终效果：完美解决！！！...
2021-11-26 16:27:34
3412
6
原创 vue为swiper的swiper-slide事件绑定点击事件时无效？
由于是vue项目，所以我使用的是VueAwesomeSwiper，但是我为每个swiper-slide绑定vue的@click事件的时候，点击事件是不会触发的解决办法：使用swiper自带的api如图使用tap，或者click都行，在这里面写你的为每个swiper-slide绑定的点击事件的逻辑就好了...
2021-11-26 16:21:03
1873
原创 vue项目使用i18n无法切换innerHTML?
一般用i18n切换中英文的时候，一般都是那些静态的元素，比如你的网页中的注入：about us、faq这样的按钮的时候，但是如果某个值是你代码中赋值了呢？比如设置了innerHTML，这个时候往往i18n就没有效果了，但是有没有解决的办法呢？有的！假设现在有个中英文切换的菜单是这样的：然后有个关注的按钮是下面这样的：需要的是切换英文的时候将“关注”换为Follow，“取关”换为Unfollow由于中英文切换的菜单在网页的header中，关注的按钮在组件personal中，而...
2021-11-26 16:14:34
519
原创 如何防止localStorage和sessionStorage在开发者工具中被手动修改？
我写的项目使用到了localStorage进行判断当前用户是否已经登录，我没有用到token，我觉得这种方式也能实现，就自己想到用这种方法，如果用户没有断开登录，即使新开一个标签页，也可以保持之前的登录状态，避免用户多次登录，影响使用体验。如题，我想介绍的方式是防止用户从浏览器的开发者工具中（chrome是application中进行查看localStorage和sessionStorage）对local和session（下均这二者均简称为local和session）进行...
2021-11-06 11:34:04
4362
4
原创 mac可以正常联网，其他的app也可以正常使用，就是浏览器无法浏览网页，解决办法在这里
之前从来没有过这种情况，但是自从使用了vpn之后就这样了，所以我推测是使用了vpn然后让网络的代理出现了问题，所以我不连接vpn的时候访问不了浏览器。解决办法：设置——>网络——>wifi——>高级——>代理我在解决了问题之前，SOCKS代理那一栏是勾上的，去掉那个勾之后，浏览器就可以正常使用了，希望可以帮助到有需要的人。⚠️注意：有人说上面的网页代理(HTTP)和安全网页代理(HTTPS)的勾也需要去掉，但是我这里本来上面就没有勾，所以保持不动，如果..
2021-08-10 10:12:31
13362
原创 使用mac外接适用于windows的键盘时，如何设置快捷键？
或许有很多人和之前的我一样有这个困扰：想给mac外接一个机械键盘，但是自己的机械键盘是适配于windows的，没有command键，连接上之后虽然也能用，但是command在键盘上被映射成了windows键，这让你在使用command+c和command+v的时候会非常难受。解决办法：首先，先安装这个用于mac键位映射的软件：karabiner-elements官网的连接在这里----->https://karabiner-elements.pqrs.org/安装完成之..
2021-08-09 12:02:33
7310
2
原创 将vue项目打包生成的dist丢到服务器上，发现访问不到资源？
写完vue项目之后，本地测试都没有问题，现在想让其他人在公网上也能访问，于是自然要用到云服务器。我目前用的是腾讯云然后加宝塔面板，很方便。 出现的问题就是，我项目在本地没有任何问题，但是丢到服务器上面，发现dist里面的css和js还有img统统都是404 not found，在浏览器的调试工具里看了之后才发现请求的路径不太正确，似乎少了一个路径，就是少了/dist，当然现在只是我的猜想。 解决办法：姑且照着猜想去实践，到vue.config.js里修改...
2021-08-04 17:36:13
2231
3
原创 使用宝塔面板时出现“站点已经存在的情况”
最近在玩云服务器，然后就了解到了宝塔面板，不得不说确实非常的方便。但是遇到了一个问题，我用图来说明：1.可以看到下图，下面那个是我刚开始添加的站点，网站名是我自己申请的域名，这里就假设它是kbxxxx.top。先忽略不看new.kbxxx.top。2.见下图，我添加新站点,可以发现站点的域名是和最初那个一样的，但是问题就出在，两个域名虽然一样，但是端口号是不一样的，按理来说应该是可以创建的对吧，但是这里就是提示添加的站点已经存在。解决办法先将域名自定义写一个，随...
2021-08-03 12:42:36
7371
1
原创 用最通俗易懂的语言详解Vue的组件通信
前言之前自学vue的时候，真的是看到类似于$这种符号就头大，组件通信在面试的时候就是大概看了下并理解了，但是并没有深入的去了解它是如何传值，如何起作用的。现在决定认真的去研究一下，写在这里力求将自己所理解消化的想法用尽量最通俗易懂的语言写出来，希望能够帮助到有需要的人。1.父组件向子组件进行传值父组件APP.vue父组件就直接使用APP.vue即可，接下来放上代码：<template> <div id="app"> <...
2021-07-31 10:14:08
184
原创 如何去判断一个input输入框中的输入为数字？
问题描述： 这是个自己在公司做项目的时候碰到的问题，起因是产品要求input输入框中只能是数字，要是位数不对，得提示用户，输入了非法的字符，也得提示用户。解决过程： 本来用的是isNaN，但是总是觉得效果不好，然后就去网上找其他方法，于是想到了正则，但是我一直没法用正则解决。解决办法： 最终还是回归到isNaN上。先贴出w3c中对于isNaN的描述：也就是说，它的字面意思就是问你：“括号里的数，它是不是不是一个...
2021-07-23 15:10:25
2504
原创 当页面缩放的时候，该怎么解决样式崩盘的问题呢？
问题描述： 自己写了一个vue的项目，由于刚入行不久吧，出现了问题也是花了很久的时间才找到问题所在，或许这就是刚入行要踩的坑吧，反正是自己遇到的错误绝对是印象深刻的，以后遇到类似的问题应该也会想起来怎么应对。 回到正题，标题就是我遇到的问题，页面缩小的时候，会发现元素是往左上角缩的，这就直接导致了样式的崩盘，原本一左一右的元素，缩小之后距离就会变得很大，而不是保持二者的相对距离。但是大多数网站在进行缩放的时候是将整个页面往中间缩小(你可以试一试csdn，也是如此)。页面放...
2021-07-23 14:56:43
1562
原创 关于使用vue的v-if时出现闪烁的情况
问题描述：使用v-if的时候，当在切换两个使用了v-if的元素的时候，很有可能会出现切换时闪烁的问题，我的理解是，每次使用v-if，都是将对应的dom元素从dom树中删除又重建，这就有一个延迟的事件，也许很短，但是体现在屏幕上就是所谓的闪烁的情况。解决办法：换而使用v-show就可以解决闪烁的问题，因为v-show就只是隐藏而已，只是将样式给隐藏，实际上它还在原来的位置，只不过是看不见了，这样两个元素在切换的时候就没有延迟，不出现闪烁的情况。...
2021-07-17 11:15:35
6593
5
原创 javascript报错BigNumber的overflow错误？怎么解决
最近做项目的时候碰到的这个问题，起初我也很迷惑，询问同事之后，一下点醒我。问题描述 需求是，函数的参数接受input框中的值，我在input框中输入了1e18的数，这个时候函数是可以正常接受这个参数进行运行的。 可是，如果我是实现将这个input框中的值保存下来，事先说明，这个时候保存的值是小数，之后需要乘1e18，就是这样，我将这样处理之后的数传到了函数的参数中进行处理，但是控制太却报了BigNumber的错误，告诉我overflow了。 ...
2021-07-16 16:08:04
1144
原创 使用metamask发起交易的时候，交易卡在pending了怎么办？
问题描述比如你在前端页面上或者直接使用metamask的钱包发起了交易，但是发现交易迟迟没有弹窗提示成功还是失败，这个时候可能是交易卡住了，一直在pending状态。在某个区块链浏览器上，在metamask钱包中使用你当前使用的区块链浏览器的公链的话，发起的交易是可以在该区块链浏览器上搜索到的，只要搜索自己钱包的地址或者收方的钱包的地址的话，就可以搜索得到。但是如果交易一旦被挂起（也就是我之前所说的卡住），也就是pending的状态，那么挂起的交易就必须被覆盖掉，否...
2021-07-16 15:52:36
18523
2
原创 教你更改element-ui的popover的背景色
这个是element-ui默认的弹出框popover的样式，其实这个弹出框是由矩形和下面的小三角形组成的，而且看下图，给出的vue部分代码也并没有提到它的样式：<template> <el-popover placement="top-start" title="标题" width="200" trigger="hover" content="这是一段内容,这是一段内容,这是一段内容,这是一段内容。"> ...
2021-07-16 15:44:53
10960
6
原创 用vue写鼠标事件没有反应怎么办？
之前在vue中写了鼠标事件，但是却发现页面上什么反应也没有，当前写法如下：我的想法是，写一个鼠标的移出事件，当鼠标移出当前的按钮的时候，将按钮的样式做一些修改，样式代码什么的都无关紧要，这里只放当前和问题有关的代码。 但是目前这种情况是实现不了的，当鼠标离开的时候，没有任何反应，我本来还以为是el-button不能绑定鼠标事件，其实并不是这样的。在查阅了官方文档之后，才发现了加一个属性有可能就能解决这个问题： ...
2021-07-16 15:19:45
1613
原创 xxx.subString is not a function?
在做项目的时候碰到了一个这个错误，我想实现的效果是将一长串字符串的中间部分给隐藏起来，比如说下面这种效果： 不用说各位也知道怎么做，我的想法是：1.var str = 要隐藏的字符串2.var temp = str.subString(start,end)3.str = str.replace(new Rexp(temp),"****");上述步骤是正确的，但是却在控制台报了这个错误，我真的是莫名其妙，一直查阅资料也找不到问题所在，我还以为str不...
2021-07-16 14:29:11
995
2
原创 利用vue实现点击导航栏定位到某个元素时，能够平滑滚动
其实方法很简单，也是走了很多弯路，见别人用的各种方法，但是自己都实现不了，等到实现的时候才发现原来如此简单，只需要几句代码即可。做的是对bilibili首页fang
2021-06-08 18:44:28
1754
4
原创 使用vue实现轮播图的时候，使用v-for发现获取不到图片？两种解决办法！
先将有问题的代码贴出来：（由于代码段没有vue格式，我这里就放截图了）
2021-06-07 11:36:22
1470
转载 HTTP1.0、HTTP1.1 和 HTTP2.0 的区别
https://www.cnblogs.com/heluan/p/8620312.html
2021-04-27 20:16:47
74
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人