redux Uncaught(in promise)TypeError:Cannot read properties of undefined(阅读“用户”)

chy5wohz  于 12个月前  发布在  其他
关注(0)|答案(1)|浏览(131)

当注册一个用户时,我得到这个错误。显然,我必须在注册用户后转发到登录页面,但我得到这个错误。看起来问题是获取用户。
这是我的不同代码。
authAction.js

export const userRegister = createAsyncThunk(
  "auth/register",
  async (
    {
      name,
      role,
      email,
      password,
      phone,
      organisationName,
      address,
      hospitalName,
      website,
    },
    { rejectWithValue }
  ) => {
    try {
      const response = await fetch("http://localhost:8080/api/v1/auth/register", {
        method: "POST",
        headers: {
          "Content-Type": "application/json",
        },
        body: JSON.stringify({
          name,
          role,
          email,
          password,
          phone,
          organisationName,
          address,
          hospitalName,
          website,
        }),
      });

      const data = await response.json();

      if (data?.success) {
        alert("User Registered Successfully");
        window.location.replace("/login");
      }
    } catch (error) {
      console.error(error);
      if (error.message) {
        return rejectWithValue(error.message);
      } else {
        return rejectWithValue("An error occurred during registration");
      }
    }
  }
);

字符串
authSlice.js

import { createSlice } from "@reduxjs/toolkit";
import { getCurrentUser, userLogin, userRegister } from "./authActions";

const token = localStorage.getItem("token")
  ? localStorage.getItem("token")
  : null;

const initialState = {
  loading: false,
  user: null,
  token,
  error: null,
};
const authSlice = createSlice({
  name: "auth",
  initialState: initialState,
  reducers: {},
  extraReducers: (builder) => {
    // REGISTER user
    builder.addCase(userRegister.pending, (state) => {
      state.loading = true;
      state.error = null;
    });
    builder.addCase(userRegister.fulfilled, (state, { payload }) => {
      state.loading = false;
      state.user = payload.user;
    });
    builder.addCase(userRegister.rejected, (state, { payload }) => {
      state.loading = false;
      state.error = payload;
    });
  },
});

export default authSlice;


authSerivce.js

import { userLogin, userRegister } from "../redux/features/auth/authActions";
import store from "../redux/store";
export const handleRegister = (
  e,
  name,
  role,
  email,
  password,
  phone,
  organisationName,
  address,
  hospitalName,
  website
) => {
  e.preventDefault();
  try {
    store.dispatch(
      userRegister({
        name,
        role,
        email,
        password,
        phone,
        organisationName,
        address,
        hospitalName,
        website,
      })
    );
  } catch (error) {
    console.log(error);
  }
};


store.js

import { configureStore } from '@reduxjs/toolkit'
import authSlice from './features/auth/authSlice';

const store = configureStore({
  reducer: {
    auth: authSlice.reducer,
  }
})

export default store;

of1yzvn4

of1yzvn41#

userRegister.fulfilled reducer的情况下,action.payload是未定义的。如果有错误或Promise拒绝,userRegister返回值,如果一切顺利,它也应该返回一个值。我假设负载应该是获取的数据。

export const userRegister = createAsyncThunk(
  "auth/register",
  async (body, { rejectWithValue }) => {
    try {
      const response = await fetch("http://localhost:8080/api/v1/auth/register", {
        method: "POST",
        headers: {
          "Content-Type": "application/json",
        },
        body: JSON.stringify(body),
      });

      const data = await response.json();

      if (data?.success) {
        alert("User Registered Successfully");
        window.location.replace("/login");
      }

      return data; // <-- return the fetched data
    } catch (error) {
      console.error(error);
      return rejectWithValue(
        error?.message ?? "An error occurred during registration"
      );
    }
  }
);

字符串

相关问题