基于React Hooks、Ant Design打造网易云音乐播放器

时间:2020-7-2 作者:admin

本项目灵感来源于掘金-Vue全家桶高仿网易云音乐mac客户端版,在掘金看到这篇文章,笔者刚开始学习React,便打算使用最新的hooks来实现一遍,加深理解。特此感谢晨曦时梦见兮提供的vue版本。

技术栈

  • React、React-Router、React-Redux、Redux-thunk,使用Create-React-App脚手架创建。
  • ui库 Ant Design
  • 列表滚动 better-scroll
  • Sass(CSS 预处理器)
  • postcss-pxtorem

项目截图

基于React Hooks、Ant Design打造网易云音乐播放器

基于React Hooks、Ant Design打造网易云音乐播放器

基于React Hooks、Ant Design打造网易云音乐播放器

基于React Hooks、Ant Design打造网易云音乐播放器

笔者有话

项目中全部使用了函数组件,笔者对于reacthooks的使用也是刚刚入门,所以代码中还有许多需要完善的,包括使用了memo包裹组件之后,函数内部的方法也应该尽可能的使用useCallback或者useMemo进行处理。部分功能还未实现,包括歌词滚动等。另外还在使用react-redux的时候,没有关注最新的hooks版本,后续会计划将项目中现有的改造成最新版的使用。第一次写,就当是记录下,感谢各位的阅读。

源码地址

基于React16.8、Ant Design的高仿网易云客户端播放器

友情链接

?基于Vue2、Vue-CLI3的高仿网易云mac客户端播放器

声明:本文内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎进行举报,并提供相关证据,工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。