0
我正在構建一個包裝HTML5 <video>標記的React媒體播放器組件，並且我在想如何使用Flux體系結構標記及其DOM事件。如何使用Flux處理狀態化DOM元素
在助焊劑中，存儲組件偵聽是其真實的來源，但使用類似<video>標籤一些元件時，DOM本身保持一定的狀態下，如paused或currentTime。我該如何調和該商店的狀態？
到目前爲止，我有一個Player組件和PlayerStore。當<video>DOM事件發生時，我一直在調度Flux動作，如handlePlay,handlePause和handleTimeUpdate以提供PlayerStore的更新，以便商店保持該狀態。同樣，我自己的自定義播放器控件也會調度相同的動作，但我不確定如何僅在原始事件來自控件時才設置<video>元素的狀態，而不是<video>事件;即我不想陷入一個循環，其中例如：
- 的
<video>發送「我的時間碼改爲」 DOM事件 - 組件聽到DOM事件，並分派行動
- 商店收到該動作並使用新時間代碼更新自己
- 收聽Store的組件聽到更改並在
<video>元素上設置（以某種方式）新時間代碼。然而，沒有理由，因爲<video>元素已經知道這個變化 - 這是幾毫秒前首先觸發它的那個元素！
你會如何處理這樣一個組件？
爲什麼不跟蹤組件本身的播放/暫停狀態（如'this.setState'）？以及爲什麼派發動作像'handlePlay'這樣的東西？組件外部是否需要了解這些事件？ – ray
下面是我將如何做到這一點：http://codepen.io/FullR/pen/YXLQyO?editors=001（不是一個功能的例子;只是基本的結構） 但我假設你不需要改變狀態的視頻元素（例如通過編程方式改變暫停狀態或通過通過的道具的時間）。如果你需要改變這些東西，我會建議利用'componentDidUpdate'鉤子來對'
我打算堅持當前的播放時間到數據庫，這就是爲什麼我涉及商店（和一個容器組件）。 –