React Redux：將數據返回給組件

我有一個組件，其中會添加一個項目。當提交表單我使用的終極版，這樣的事情分派異步操作：React Redux：將數據返回給組件

_onSubmit(event) { 
    const { dispatch } = this.props; 
    const { data } = this.state; 
    event.preventDefault(); 

    dispatch(addItem(data)); 
    }

現在，我的後端將創建一個ID，我可以跟蹤進度的任務。通常這個給定的任務需要一段時間才能完成，所以我想顯示通知欄。

對於我來跟蹤該任務，我需要檢索正在進行的給定任務的任務ID。所以我想增加一個回調函數，這樣我可以得到的調度信息，像這樣：

_onSubmit(event) { 
     const { dispatch } = this.props; 
     const { data } = this.state; 
     event.preventDefault(); 

     dispatch(addItem(data, (id) => console.log(id))); 
     }

但因爲有一個雙向數據通信回事這種感覺有種「哈克」。

問題：實現這個的最簡單方法是什麼？

來源

2017-04-08 Alan Souza

因此，您的端點在收到帶有任務ID的帖子請求後立即發送響應？ – KornholioBeavis

是的！或幾乎立即 –

好了，所以這個過程是這樣的：1。 fething_task_Id 2. taskId_fetched_successfully //加載，任務在後臺運行的地方3. // task_finished數據//渲染數據 – KornholioBeavis

可以有多種方法來實現這個問題相同的結果。

我會說使用Redux Thunk（中間件），它將使您能夠從動作創建者發起多個動作。

那麼你應該寫這樣的事情：

_onSubmit(event) { 
const { dispatch } = this.props; 
const { data } = this.state; 
event.preventDefault(); 

dispatch(addItemActionCreator(data)); 
}

在你行動的創建者，使用一個承諾（如形實轉換可以讓你做到這一點爲好）：

export const addItemActionCreator = (data) => (dispatch) => { 
Promise.get('data').then((data) => { 
    dispatch({ type: STORE_DATA_ID, id: data.id }) 
}) 
}

這將派遣一個將在你的狀態下存儲id的動作。

在您的組件中，使用connect訂閱id，並且您的組件始終具有最新的id值。

希望這會有所幫助。

來源

2017-04-08 05:16:41 shobhit1

謝謝您的回答，我m已經在使用thunk。不幸的是我相信你的回答並不能解決我的問題。可以有多個任務在運行，我怎麼知道來自ID的數組是哪一個屬於我？我的對象（數據）裏面沒有任何東西保證是唯一的。 –

爲什麼不添加一些獨特的內部數據對象？ – elmeister

因此，爲了您追蹤不同的ID，您將擁有不斷更新的動作類型，這些動作類型只會更新您的狀態的一部分，您將如何知道具體的ID。你將不得不派遣不同的動作來在你的狀態的不同部分存儲不同的ID，否則它們會重疊，你的常量（動作類型）會讓你控制更新狀態的哪一部分，然後你可以訂閱那部分國家我希望這可以幫助。 – shobhit1

有幾種不同的方法來實現這一點。我使用redux-saga和eventChannels做了非常類似的事情。

您也可以使用redux-cycles或redux-observable來達到同樣的目的：創建一個訂閱了API信號的可觀察對象，並在它發出時調度它。

我不是一個重量級的粉絲。也許可能有一種方法可以使用redux-thunk來完成此操作，但我確信它不會很簡單/優雅。

來源

2017-04-09 00:57:15 Josep

React Redux：將數據返回給組件

回答

相關問題