fetcher，navigate以及 reduxThunk的 状态情况整理

fetcher

来源：react-router useNavigation

状态说明

• 常规的navigation 或 GET 请求 的状态变化: idle -> loading -> idle
• POST, PUT, PATCH, or DELETE 请求的状态变化：
  idle -> submitting -> loading -> idle

navigate

来源：react-routeruseFetcher

状态说明

• idle ：没有请求
• submitting： 使用 POST, PUT, PATCH, or DELETE请求的状态变化
• loading：fetcher调用加载器(从fetcher.load调用)，或单独提交或useRevalidator调用后的重新验证

reduxThunk

来源：redux toolkitcreateAsycnThunk

注⚠️：需要在reducer 或 组件中 判断 thunk状态

状态说明

• idle
• fulfilled
• rejected

在reducer使用状态判断示例

const usersSlice = createSlice({
  name: 'users',
  initialState: {
    entities: {},
    error: null,
  },
  reducers: {},
  extraReducers: (builder) => {
    builder.addCase(updateUser.fulfilled, (state, { payload }) => {
      state.entities[payload.id] = payload
    })
    builder.addCase(updateUser.rejected, (state, action) => {
        state.error = action.error
    })
  },
})