Question

当前，我有一个表单，用户可以在其中填写姓名，电子邮件，地址，大学等字段。但是，我们有来自API的大学列表。该请求是通过redux-saga发出的，响应填充了视图中的一个选择。

我知道redux-saga可以帮助我管理异步操作，但可以将这种响应保持在我的全局状态（在该状态下，我只会使用一次看起来很奇怪）。

我可以清楚地看到或理解任何答案或模式吗？

非常感谢您。

Answer 1

绝对不会。 Redux的状态适用于non-ephemeral数据：

将React用于短暂状态，此状态对应用程序全局无关，并且不会以复杂的方式进行更改。例如，在某些UI元素中切换，即表单输入状态。将Redux用于全局重要的状态或以复杂方式突变的状态。例如，缓存的用户或帖子草稿。

Answer 2

正如其他人指出的那样，简短的答案是“否”，除非您的数据将继续与应用程序的其余部分相关，否则您不应将数据保留在Redux存储中。

如果您使用Redux-Saga处理异步数据提取操作，您可以做的是在操作中传递onSuccess和onFailure回调，以在异步调用完成后调用saga 。例如，使用react挂钩可以执行以下操作：

const SelectUniversity = ({getUniversities}) => {
  let [universities, setUniversities] = useState({
      fetched: false
  });

  const handleSuccess = (items) => {
      setUniversities({
          fetched: true,
          items: items
      });
  }

  const handleFailure = (error) => {
      setUniversities({
          fetched: true,
          error
      });
  }

  useEffect(() => {
      if(!universities.fetched){
          getUniversities(
              {foo: bar}, // async call params if any needed
              handleSuccess,
              handleFailure
          )
      }
  }, [universities])

  return !universities.fetched
    ? <Spinner />          // if universities not fetched yet, show loading spinner
    : !universities.error  // if fetched and no error, display results
        ? <Select items={universities.items} />
        : /* if fetched and error, handle error case here */;
}

const mapDispatchToProps = dispatch => ({
  getUniversities: (params, onSuccess, OnFailure) => dispatch({
      type: 'FETCH_UNIVERSITIES',
      payload: { params, onSuccess, OnFailure }
  }),
})

export default connect(
  null,
  mapDispatchToProps
)(SelectUniversity)

然后在您的sagas文件中，您将执行以下操作：

function* fetchUniversities({type, payload}){
  const { params, onSuccess, OnFailure } = payload;
  try{
    const universities = yield call(fetchUniversities, params); // your actual async fetch call
    yield call(onSuccess, universities);
  }catch(err){
    yield call(OnFailure, err);
  }
}

export function* watchFetchUniversities() {
  yield takeLeading('FETCH_UNIVERSITIES', fetchUniversities)
}

当我使用redux时，即使结果仅使用一次，我也应该始终将响应保持在全局状态吗？

2 个答案: