如果條件爲

之後的其他操作，Redux調用操作我應該如何在redux中實現以下邏輯：有2個操作：同步和異步。假定它的validate（）和save（）。當用戶單擊按鈕validate()執行，它會更改狀態存儲中的一些isValid變量。然後，如果isValid執行保存操作。如果條件爲

來源

2016-04-24 xander27

驗證時發生，您應該執行saveAction，並用它來修改這兩個變量的isValid和減速器等變量。在等待isValid變量被設置爲true時沒有真正的用處。 –

@bhargavponnapalli問題是第二個動作是異步（react-thunk），所以它不能只與第一個組合。 – xander27

您也許可以在異步操作中進行驗證，而不是單獨的驗證操作。只是一個想法。 –

你可以'包裝'在'點擊處理程序'這些功能。

//call it on button click 

handleClick =() => { 
    if (validate()) { 
    //call save function 
    save() 
    } 
} 

validate =() => { 
    //do something 
    //check validness and then 
    if (valid) return true 
}

來源

2016-04-24 14:47:59 Spooner

我認爲驗證邏輯應該在reducer中，但不能僅僅在clicnk hadler中。關鍵是要以'還原的方式'來實現它。 – xander27

我的意思是redux動作（http://redux.js.org/docs/basics/Actions.html）不只是JS方法 – xander27

我不認爲減速機是一個好的地方。對於我來說，我更願意將減速機與這類東西保持一致，並將它們僅用於更換部件狀態。你可以創建類似utils文件的東西，並保留所有這些功能。但是如果你不喜歡這個，我建議你看一下redux thunk，它會允許你在動作創建者中返回fucntions，你可以在那裏指定你的邏輯。 – Spooner

有很多方法可以做你想做的事。但是，作爲一般規則，不要在Redux中存儲可導出的任何內容。 isValid可以通過在您的字段上運行驗證來派生。此外，我不認爲中間狀態像變化的表單域值屬於Redux。我會將它們存儲在React狀態，直到它們被認爲有效並提交。

就這樣，正如Spooner在評論中提到的那樣，您可以在thunk中調用同步操作。或者你可以訪問thunk中的狀態。

選項＃1

// Action Creator 
export default function doSomething(isValid) { 
    return (dispatch) => { 

     dispatch(setValid(isValid)); 

     if (isValid) { 
      return fetch() //... dispatch on success or failure 
     } 
    }; 
}

選項＃2

// Component 
dispatch(setValid(isValid)); 
dispatch(doSomething()); 

// Action Creator 
export default function doSomething() { 
    return (dispatch, getState) => { 

     const isValid = getState().isValid; 

     if (isValid) { 
      return fetch() //... dispatch on success or failure 
     } 
    }; 
}

來源

2016-04-24 17:10:38

回答

相關問題