小编rgd*_*dzv的帖子

刷新页面后如何正确保存Redux状态?

请求代码:

export class LogInContainer extends Component {

  submit = (values) => {
    const { mutate } = this.props;
    mutate({
      variables: {
        email: values.email,
        password: values.password,
      },
    })
      .then((res) => {
        const token = res.data.login.token;
        localStorage.setItem("token", token);
        const user = res.data.login.user;
        const { logIn } = this.props;
        logIn(user);
        this.props.history.push("/pages/processes");
      })
      .catch((error) => {
        const errorMessage = error.message;
        const { logInError } = this.props;
        logInError(errorMessage);
      });
  };

  render() {
    const { error, logInCleanError } = this.props;
    return (
      <LogIn
        onSubmit={this.submit}
        errorMessage={error}
        logInCleanError={logInCleanError} …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs redux apollo-client

7
推荐指数
1
解决办法
6036
查看次数

如何正确更改 RTK 查询中的响应数据?

我正在尝试在货币转换器应用程序中使用 RTK 查询。这个应用程序是基于2个API。

首先,我正在获取一个带有货币的对象。然后,我获取一系列国家/地区并对其进行过滤,具体取决于该国家/地区是否拥有该种货币。

商店代码:

export const store = configureStore({
  reducer: {
    [currenciesAPI.reducerPath]: currenciesAPI.reducer,
    [countriesAPI.reducerPath]: countriesAPI.reducer,
  },
  middleware: (getDefaultMiddleware) =>
    getDefaultMiddleware().concat(currenciesAPI.middleware, countriesAPI.middleware)
})
Run Code Online (Sandbox Code Playgroud)

API代码:

export const currenciesAPI = createApi({
  reducerPath: 'currenciesAPI',
  baseQuery: fetchBaseQuery({ baseUrl: 'https://api.frankfurter.app'}),
  endpoints: (build) => ({
    fetchAllCurrencies: build.query<Currencies, void>({  
      query: () => ({
        url: '/currencies'
      }),
    })
  })
})

export const countriesAPI = createApi({
  reducerPath: 'countriesAPI',
  //tagTypes: ['Country'],
  baseQuery: fetchBaseQuery({ baseUrl: 'https://restcountries.com/v3.1'}),
  endpoints: (build) => ({
    fetchAllCountries: build.query<TransformedCountries[], string>({  
      query: () => ({
        url: '/all'
      }),
      transformResponse: …
Run Code Online (Sandbox Code Playgroud)

reactjs redux react-redux redux-toolkit rtk-query

6
推荐指数
1
解决办法
5088
查看次数