如何在组件渲染或更改时保持歌曲播放，并使用react js更新底部导航栏中的播放/暂停状态

Question

ReactJs。

1. 显示相册名称列表的主页，如"相册abc">
2. 用户点击专辑"abc"，就会看到与该专辑相关联的歌曲列表，比如歌曲1、歌曲2、歌曲3
3. 用户播放歌曲1(播放歌曲(

下面是我要做的，在第三步之后，我希望底部的音乐导航栏在播放时显示歌曲名称并显示播放图标。(就像jiosaavan和其他应用程序一样(

此外，当我播放歌曲并移动到另一个组件时，歌曲会暂停。[我正在使用ref播放歌曲]

注意：我的代码不好，所以我从头到尾都在看非常感谢。

Answer 1

试着像navHeader一样在app.js中使用组件，并将音乐细节保留在该组件中，这样在每次更改组件时都不会呈现，这可能会有所帮助。

<Router>
your list of route here...
<musicPlayer/>
</Router>