![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
项目细节
文章平均质量分 71
在项目过程中发现的一些细节与bug
hhhhhhhssss
有志成为大佬的前端菜鸡
展开
-
$set解决vue中修改数组或对象视图不更新的问题
文章目录前言一、案例二、解决方法$set总结前言相信大家和我一样,在开发中总是遇到一个问题。为啥我修改v-for遍历的数组,视图却没有更新???当我点击其他操作重新渲染后,又更新了???这不会是vue出bug了吧这项问题其实正是由vue的双向绑定造成的,vue在2.x的版本中还在使用defineProperty方法,这就是defineProperty中的一个问题。所以在vue3.0中,使用了proxy取代了defineProperty。对此本文不多做解释,有兴趣的朋友可以去查阅下资料。回到正原创 2021-07-16 15:50:58 · 1767 阅读 · 0 评论 -
超超超超详细!手把手带你用js实现简易版position:sticky
前言前面我们在介绍position属性时(不知道的小伙伴可以去看看我的另一篇说position的博客哟,传送门:手把手带你体验position各种属性)有了解到,sticky的兼容性是很差的,那么我们想达到类似的效果该怎么办呢?废话不多说,开撕一、基本思路sticky就是元素处于页面某个布局,当元素超出可视区时,根据设置进行定位。官方介绍:它的行为就像 position:relative; 而当页面滚动超出目标区域时,它的表现就像 position:fixed;,它会固定在目标位置。思路:当原创 2021-07-14 22:21:44 · 1663 阅读 · 1 评论 -
防抖节流原理及实现(含演示图)
文章目录前言一、防抖(debounce)1、什么是防抖?2、防抖实现二、节流(throttle)1.什么是节流?2.节流实现总结前言随着前端飞速的发展,用户体验也越来越重要。大家在逛一些网站时,会不会手贱,去疯狂的点击某个按钮,但是做了后却发现,网站都是,你点归你点,我动算我输。这其实就是因为做了防抖节流操作啦,为什么这两个东西这么神奇呢?让我们一起探究一下吧。一、防抖(debounce)1、什么是防抖?通俗来说就是当一个事件一直处于频繁触发的情况下,禁止触发,直到频率降低到规定的程度,才允许原创 2021-07-13 22:12:20 · 7257 阅读 · 2 评论 -
手把手带你在vue中封装axios(含携带token)
文章目录前言一、认识axios1、axios是什么?2、为什么要用axios?特性二、封装axios1.引入库2.建立封装axios实例文件3.导入所需依赖4.创建axios实例5.axios拦截器请求拦截器响应拦截器5.封装成请求6.完整代码代码代码中的setLocalStorage和getLocalStorage方法setLocalStoragegetLocalStorage总结前言在前端的高速发展下,单页面应用大多采用前后端分离的开发思路,现在帮助前后端交互的工具数不胜数,axios无疑是当今原创 2021-07-13 19:50:40 · 16895 阅读 · 3 评论 -
基于vue的高仿网易云音乐网站,实现大多数功能
文章目录前言项目演示地址线上地址项目仓库总结前言基于Vue + Vue-Router + Vuex + axios + elementui,ui参考网易云音乐,后端接口使用网易云音乐接口.,项目中遇到的bug基本都有解决项目演示地址bilibili高仿网易云音乐.线上地址wdwmusic.(第一次部署阿里云导致跨域啥的没有做好可能会有某个数据没有请求到)(屏幕适配不是做得很好,可以适当调节浏览器大小食用)项目仓库前端仓库地址.总结博客里不太好放图片视频,希望大家可以去上面的b站演示视频原创 2021-02-14 16:06:24 · 1852 阅读 · 3 评论 -
element导航栏对应路由高亮在刷新或前进后退时错误(二级子路由和三级子路由以上各自的解决办法)
问题描述:当设置的有默认路径时,进入到二级或三级路由时,刷新或前进后退操作会导致导航栏高亮没有改变或错误使用前提将router里面的main.js里的路由路径设置全部设置为完整的路径。routes: [{ //路径为空时跳到发现音乐 path: '', redirect: '/musicHome/findMusic', }, { path: '/musicHome',原创 2020-12-09 21:16:04 · 797 阅读 · 1 评论 -
vue+element制作音乐播放器播放进度条bug(鼠标拖拽slider滑块滑动到指定位置无效)
最开始bug还没解决时的效果图bug解决后的效果图项目场景:想自己做一个基于vue仿网易云音乐的音乐网站,在制作播放器的时候用到了element ui里面的slider组件,制作完成后发现使用change的方法无法达到我需要的效果,上网查询发现没有好的方案,后面自己琢磨后发现解决方案问题描述:在进度条制作完成以后,发现可以通过点击定位到进度条相应的位置,但是在用鼠标拖拽进度条时有时候会失败,达不到那种可以通过点击跳转到指定区域的功能,并且在鼠标滑动时,进度条依旧在变化。template:&原创 2020-12-09 18:06:58 · 4285 阅读 · 4 评论 -
vue给路由添加滚动条达到路由内滚动
前言在我们制作网站不止一级路由时,可能会要在子路由里面单独设置一个滚动条。而不是由网页自带的滚动条进行滑动。不然可能会出现这种效果网页自带滚动条滑动如果用网页自带的浏览器的话就是整个页面向下滑动,如果用户想切换到另一个子路由模块的话,就得返回顶部才能操作。总所周知,用户体验是最重要的,我们为了节省这一步。是不是可以在子路由里面给他加上一个滚动条而达到只有子路由里面内容滚动呢????怎样给子路由加上滚动条overflow-x或overflow-y给子路由加上一个id,然后给他加上样式 <原创 2020-12-09 20:09:11 · 1126 阅读 · 1 评论