Redux - 异步 - 输入字段更改时的 POST 状态

Posted 2023-02-19

【中文标题】Redux - 异步 - 输入字段更改时的 POST 状态

【英文标题】：Redux - Async - POST state on input field change

【发布时间】：2017-09-15 06:43:48

【问题描述】：

我有一个包含一些非常简单的表单字段的应用程序，并且希望在每次更新字段时触发对服务器的 POST 请求，以便在数据库中同步数据。

在输入字段更改时，将使用要更新的字段的键和值调度同步操作。此操作由以下 reducer 处理。

export const reducer = (state, action) => 
  switch(action.type) 
    case INPUT_FIELD_UPDATE:
      return Object.assign(, state, 
        [action.key]: action.value
      );
    default:
      return state;
  
;

现在我想将整个新的更新状态发布到服务器。

如何使用 redux-saga/redux-thunk 来实现？在上述reducer完成更新状态后立即触发另一个动作是否正确？如何触发此类操作？

根据下面的响应，我将使用新值更新状态，然后将数据发布到 saga 处理程序生成器中的服务器，但我不确定此实现是否正确。 How to fire AJAX calls in response to the state changes with Redux?

POST 整个状态并在每次更改时将其与服务器同步是否正确？是否应该只发布新值并在响应时更新应用状态？

您会建议一种完全不同的方法吗？

我想澄清一下，经过一段时间的搜索，我的问题没有找到任何明确的答案。 Redux 堆栈中的新成员，我不太确定我的问题可能有多相关。

【参考方案1】：

实现比最初想象的要简单得多。我唯一需要做的就是在我的 sagas 中“听到”相同的调度动作。

function* handleChange(action) 
 try 
    let state = yield select(state => state);
    yield put(syncing());
    const response = yield call(api,state);
    if(response.updated) 
       yield put(syncSucceeded());
     else 
      yield put(syncFailed());
    
   catch (e) 
    yield put(syncFailed(e));
  


function* mySaga() 
   yield takeLatest(INPUT_FIELD_UPDATE, handleChange);