2017-04-05 7 views
0

リアクションコンポーネントには、ライブストリームを再生するAudioオブジェクトが含まれています。コンポーネントが最初にロードされると、再生が開始されますが、コンポーネントをアンマウントしてから再マウントすると、再生ボタンが機能せず、ストリームが再開しません。Reactで再マウントされたときにオーディオオブジェクトがストリームを再開しない

import React from 'react' 
import compose from 'recompose/compose' 
import lifecycle from 'recompose/lifecycle' 

const enhance = compose(
    lifecycle({ 
    componentDidMount() { 
    this.audio = new Audio() 
    this.audio.src = 'http://some-stream-url.com' 
    this.audio.play() 
    this.audio.muted = true 
    }, 
    componentDidUpdate() { 
    this.audio.muted = !this.props.playing 
    }, 
    componentWillUnmount() { 
    this.audio = '' 
    this.audio = null 
    } 
}) 
) 

const Player = (props) => null 

export default enhance(Player) 

答えて

1

停止オーディオと現在の時刻を再起動します。ここでは

は、コンポーネントとライフサイクルメソッドのコードです。

componentWillUnmount() { 
    this.audio.pause() 
    this.audio.currentTime = 0 
} 
+0

残念ながら、これはちょうどオフラインになる前に最後の数秒をキャッシュするようですが、ストリームを再びインスタンス化しません –

関連する問題