- 博客(20)
- 收藏
- 关注
RSS订阅原创 【面经整理4】await和高频css
BFC指的是Block Formatting Contex块级格式化上下文，具体理解就是相当于使用一个框框住元素，使得元素的布局不受外界的干扰。
2023-03-21 17:41:00
198
原创 【面经整理2】垃圾清理机制、挥手握手、HTTP状态码、let const var、set map
新生代中存放的是生存时间短的对象，老生代存放生存时间久的对象。
2023-03-18 14:36:53
195
原创 【vue2静态复古win95简历网页】窗口实现
如果WindowState设为open，那么就激活窗口。先更新窗口状态，同时执行z-index递增函数让窗口置于最前，通过pushActiveWindow将激活的窗口push进激活队列。如果WindowState设为minimize，先更新窗口状态，然后取消激活窗口。使用interact.js实现窗口拖拽，首先配置拖拽事件，绑定点击激活事件，点击窗体的话顶部变蓝表明激活中。如果WindowState设为close，先更新窗口状态，从激活队列中删除窗口，然后取消激活窗口。然后实现top-bar顶部栏，绑定。
2023-03-14 17:07:57
147
原创 【vue2静态复古win95简历网页】模仿电脑状态栏实现
使用moment.js来获取事件，并通过定时器每秒更新。如果窗口正在被激活，导航栏启用depress激活样式。在App.vue中导入底部导航栏。使用边框来实现立体效果。开始栏使用a标签实现。
2023-03-14 11:14:15
174
原创 【vue2静态复古win95简历网页】模仿电脑桌面实现
在App.vue中，通过v-for循环读取windows中的窗口数据，读取窗口专属信息以便于post到窗口中body的背景风格使用css设置，overflow: hidden来创建BFC防止高度塌陷使用component 来表示单独的图标，读取存在store中的信息使用v-if来选择是否展示打开的单独窗口。
2023-03-13 22:28:40
604
原创 【vue3仿网易云app】登录逻辑
5.最后，前端在向后端发送其他请求的时候，需要在请求头中带上token（项目中通常封装在请求拦截器中），后端判断请求头中有无token，有则验证该token，验证成功就正常返回数据，验证失败（如已过期）则返回相应错误码。前端拿到错误信息，清除token并回退至登录页。4.前端每次跳转至需要具备登录状态页面时，都需要判断当前token是否存在，不存在就跳转到登录页，存在则正常跳转（通常封装在路由守卫中）2.后端收到请求，验证用户名和密码，若验证失败，返回错误信息，前端提示相应的错误信息。
2023-03-07 01:25:00
346
原创 【vue3仿网易云app】播放页面实现
歌曲播放的时长大于上一句歌词结束的时间并且小于下一句歌词的时间，中间就是正在播放的歌词。播放时rotate(30deg)，暂停时rotate(-10deg);然后是模拟歌词播放，第一步在store/index.js中处理歌词。从上往下看，首先是一个走马灯的音乐标题播放。使用marquee来实现。
2023-03-07 01:11:15
408
2
原创 【vue3仿网易云app】歌单播放列表实现
点击播放按钮时把当前索引传入setPlayIndex。使用filter:blur 进行背景模糊。使用v-for循环来渲染item。
2023-03-06 22:15:24
315
原创 【vue3仿网易云音乐app】音乐播放控制器的实现
在 store/index.js 中设置存储数据的playlist以及当前播放歌曲的索引playCurrentIndex。避免初始化时列表为空，首先预设一首歌曲。在method中设置play方法，如果点击按钮，将会播放音频，同时paused属性设置为false，更新播放时间。通过playlist[playCurrentIndex]来获取歌曲的信息，并替换播放的专辑图片和歌曲名称。使用定时器来设置更新时间方法，每秒更新一次当前状态。设置播放暂停按钮，绑定play播放事件，使用v-if来判断是否显示播放标签。
2023-03-06 21:49:26
819
原创 【vue3仿网易云音乐app】歌单列表以及歌单界面
在musicList.vue中调用，将异步获取到的结果存在响应式对象state.musicList中。由于从后台获取到的是完整数字，展示出来太长了，所以转换成万、亿单位会有更好的视觉效果。在setup同步方法中，定义一个changeValue函数，使用整除的思想转换单位。点击歌单跳转到单独的详情页涉及到了路由跳转，因此使用router-link。在api/index.js中定义获取歌单方法。往to中传入baseurl和特定的id信息。在template中调用该方法。
2023-03-06 17:43:21
921
原创 【vue3仿网易云音乐app】主页代码解析之导航栏轮播图
实际运行时，轮播图需要从后台网易云音乐api获取。使用axios来进行异步请求。在api/index.js中。一般来说js实现轮播图的原理是设置定时器实现轮播，为了方便使用swiper插件。通过getBanner获取到网易云实时轮播图数据并赋值给imgs数组。其中使用$router.push给。首先是topNav顶部导航栏组件。在script中指定预设图片。接下来是轮播图的实现。界面主页引入各个组件。
2023-03-05 18:26:37
327
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人