Open Yagami360 opened 2 years ago
LiveChatList
で独立させたときに、チャットが表示されたりされなかったりするバグの修正
liveChatId
と liveBroadcastContent
の値がセットされていたり、されていなかったりするのが原因。VideoWatchPage
側のステート liveChatId
, liveBroadcastContent
の値は、初回起動時に空値 ""
で初期値され、その後に実際の値が設定されている。子コンポーネントの引数 liveChatId
, liveBroadcastContent
には、初回起動時の空値 ""
が設定されるが、親関数コンポーネント側で値の更新が行われた後の値が再設定されていないことが原因liveChatId
, liveBroadcastContent
はステートと定義」しているので、親関数コンポーネント側で値の更新が行われた後に再度子コンポーネントの引数 liveChatId
, liveBroadcastContent
の再設定が行われるはずだったが、行われていない。その原因は不明。ステートの挙動を勘違いしている?liveChatId
, liveBroadcastContent
の値は更新されていた。副作用フック内を useEffect( () => {...}, [liveChatId, liveBroadcastContent])
で定義し、引数(=ステート)更新後に、副作用フックを再度呼び出すようにすることで解決したfillText()
前の clearRect()
で canvas 全件をクリアしているために、チャットを縦に並べて同時レンダリングできていない?clearRect()
でチャット位置のみクリアすると、残像が残るonUpdate()
の後に timeline の onUpdate()
がコールバックされるので、timeline の onUpdate()
内にて、最初に clearRect()
して、その後各 tween に対する fillText()
を for ループで回せば良い?VideoWatchPageConfig.intervalTimeChat
で設定されているライブチャット取得間隔で取得した複数のライブチャット情報のうち、1つのライブチャット情報しか字幕表示されない問題の修正context.drawImage()
する方法
contentWindow.document
で iframe タグの大本の動画が存在する親ページ(YouTube)の document オブジェクトにアクセスしようとすると、CORS エラーが出てできないのでNGcontext.drawImage()
する方法
context.drawImage()
する方法
全般