使用React构建一款音乐播放器_技术问答

首页免费课使用React构建一款音乐播放器问答

使用React构建一款音乐播放器

全部评论问答未解决精华

雪过无痕

推荐下自己写的一个音乐播放器，https://github.com/snow-imprint/react-music-player

1 3-1 header组件开发

2018-03-01

门上的摇晃头脑还在炫耀

视频看完了跟着项目做完了过程经历一些版本的更新所以只能网上再找找教程总算把这个项目堆完，感谢老师的课程，看完之后对react有了更深的认知
em....这个是项目地址附上：http://react.env107.com/dist/

2018-02-26

KB_Handler

ES6模板字符串语法
<div className='bar' style = {{width: `${this.props.progress}%` }}></div>
注意： ` 这个不是单引号而是键盘ESC下边那个键

0 3-4 进度条组件完善（1）

2018-02-25

KB_Handler

采坑总结
1： render函数中 <Header /><div id='player'></div><Progress progress={this.state.progress} />
2： npm install jquery jplayer --save-dev (使用了这个就不用像老师那样在html中样引入cdn的连接了)
3：在root.js中写入 import $ from 'jquery'; import 'jplayer';
4：其他都和老师一样，包括楼下同学讲得什么$(this)不可用，其实也是可以的！

0 3-3 React组件初识及jPlayer插件了解

2018-02-24

KB_Handler

看着楼下同学的各种评论瞬间觉得yo react-webpack真真好用看老师的逻辑就行

0 3-2 进度条组件基础样式开发

2018-02-24

KB_Handler

还是感觉 " yo react-webpack 项目名 " 这个好用

0 2-2 webpack dev server和常用插件使用

2018-02-24

qq_呃_6

电脑需要
$('#player').jPlayer( "play", progress*100 );
才正常运行

0 3-5 进度条组件完善（2）

2018-02-24

web_zhang

react-hot-loader已经可以不用了webpack-dev-server 自带新功能 HMR （hot-module-replacement），自己配置下就行

0 2-2 webpack dev server和常用插件使用

2018-02-21

记忆之城

如果用ES6类创建方法，需要在构造函数类内绑定该方法，否则报“state not defined”错，ES6类移除了除去默认方法中的autobind this。所以在构造函数中，需要添加：

this.play = this.play.bind(this)

0 3-6 播放器播放控制UI及逻辑开发

2018-02-18

SHIVER_Z

照着老师代码写 ui出来了但是不能播放的同学可以看看 index.tpl.html中有没有加上一个id为player的div

1 3-6 播放器播放控制UI及逻辑开发

2018-02-18

记忆之城

还有个坑，除了jQuery加载失败，jPlayer也会加载失败，报：“jPlayer is not a function” 错。虽然jPlayer是jQuery的插件，但是仍然需要手动声明。同加载jQuery类似。
步骤：
1. npm install jpalyer
2. 在需要用的页面（root.js）添加：import jplayer from 'jplayer'

注：其实引用头文件完全不用加分号 (,) ，用ES6创建类的话，里边每一行语句也不用加分号。

2 3-3 React组件初识及jPlayer插件了解

2018-02-18

记忆之城

被“Uncaught ReferenceError: $ is not defined” 卡住的小伙伴们，
我发现可以把jQuery用npm倒入进来，这样就不会报错了。
步骤：
1. npm i jquery --save
2. 在需要用的页面（root.js）添加：import $ from 'jquery';
问题就解决了。

2 3-3 React组件初识及jPlayer插件了解

2018-02-18

nnngu

我把这个 React 音乐播放器和 React 画廊应用整合在一个项目里，另外还添加了封面图片旋转功能，附详细的README文档。预览地址： https://nnngu.github.io/MusicPhoto/
源代码： https://github.com/nnngu/MusicPhoto

2018-02-08

慕前端5585029

按照这个大神WU5229485的代码写了，但是我的/list下面的页面显示不出来Cannot GET /list，这是为什么呢

0 3-8 页面导航，React-Router学习

2018-01-29

记忆之城

跳跃好大，亿脸懵逼 -_-|||

1 2-2 webpack dev server和常用插件使用

2018-01-28

首页上一页 2 3 4 5 6 7 8 下一页尾页

该课程已下架

课程须知: 1、有一定的前端开发经验 2、熟悉HTML、CSS，精通JavaScript 3、对前端工程化有一定的了解 4、了解ES6一些基本语法

老师告诉你能学到什么？: 1、webpack的配置 2、开发环境的搭建 3、React与传统开发的理念差异 4、组件化开发 5、React-Router的使用 6、事件订阅及通信 7、一些最佳实践

微信扫码，参与3人拼团

热搜

最近搜索清空

使用React构建一款音乐播放器