基於React的仿QQ音樂（移動端）

前言

因爲這段時間工做上也是挺忙的，就沒有時間去寫這個項目，中間一直都是寫寫停停，進度也是很是慢的。正好前幾天都還比較空，就趕忙抓着空閒時間去寫這個項目，最後緊趕慢趕地完成了。本項目採用了React的框架，能夠幫助那些想學習React的同窗們去深刻學習React的項目的開發。寫這個項目過程也是很是辛苦的，若是你以爲我寫的還不錯的話，麻煩各位給我一個收藏或者點贊，也或者去github上給我點個星，來當作對個人鼓勵。不勝感激！

源碼地址

https://github.com/ruichengpi...

演示地址

https://ruichengping.github.i...

技術棧

1. react
2. react-router
3. react-redux
4. es6
5. axios
6. webpack

已實現功能

Tab-個人

Tab-音樂館

Tab-發現

側滑欄

播放列表

播放器

歌曲搜索

歌單管理

項目總結

整個項目採用了React這個框架來構建，以前我都是用Vue用作開發的。正好藉此機會作一個小小的對比，純是我的使用的心得體會。若是你也有一些不同的心得交流的話，歡迎交流。

1. React相比Vue給我感覺最深的就是他的優雅的組件化，用起來是很是爽，誰用誰知道，引用便可使用。而Vue在這塊相對來講就要弱一點，引用了組件以後還要註冊一下。固然這不是決定React組件化優於Vue決定性因素，更重要的Vue的模板語法以及它下面那套指令系統。相信用過的小夥伴們知道，Vue的template裏面出現語法錯誤，追蹤起來很費時費力的，很難定位到問題。另外這套指令系統在多人共同維護的大型項目中弊端很大，層層的指令嵌套使得代碼閱讀起來晦澀難懂，維護起來異常麻煩。而React在這上面給我感受就好不少，代碼可讀性也很是高。
2. Vue在雙向數據綁定的體驗上要優於React的，React採用的是Flux的單向數據流動。這在實現一些須要雙向數據交互的功能上，Vue是佔有優點的。
3. Vue相比React更加輕量級。Vue只須要引用一個Vue.js便可使用，而React則要引用React.js、React-dom.js、babel.js(用於轉換jsx的語法)。
4. Vue在上手程度上要優於React。Vue學習成本很低，另外官方有比較完善的中文文檔。而React官方則只有英文文檔，另外學習成本也比較高。我見到網上某人噴只會Vue的是前端小白，我對這種人只能報以呵呵。簡單自己是沒有錯誤，一個東西能以簡單的方式解決難道很差嗎？關於這個中文文檔竟然還有人噴那些喜歡用Vue的是否是英文能力差，我就再報以呵呵一笑。自己擁有中文文檔就是一個優點，結果還成了被噴的地方。首先，並非全部人的英文能力都跟某些嘴炮大神那麼牛逼的。其次，就算是英文能力牛逼的人，你敢說你閱讀中文的能力會比你閱讀英文能力差？
5. 我我的感受Vue的全家桶（不包括Vue）使用起來，我我的感受是要比React的全家桶（不包括React）使用起來舒服的。
6. 雖然Vue在一些細節上要比React好，可是不能以爲React就比Vue差。這種想法是錯誤。特別是大型應用上，使用React項目維護起來確定是要比Vue要好的。固然這不表明Vue不能構建大型應用。
7. React在社區生態建設上是比Vue好不少的，並且後面站着FaceBook。不怕遇到問題沒人能夠幫你解決的狀況，而Vue的話就要稍微擔憂一下。

最後強調一下：React和Vue都是很是棒的前端框架，建議你們都去學習一下。採用React或者是Vue仍是要結合業務場景和現實狀況作選擇的。單純說React仍是Vue好，我我的以爲都是耍流氓。