Блог

Я создал проект с машинописным текстом redux toolkit, и все было в порядке, пока я не захотел отправить действие за пределы компонента. Я использовал store.dispatch(removeToken()), но как только строка будет запущена, она выдает ошибку : Ошибка типа: Не удается прочитать свойства неопределенного (чтение «Начальная загрузка»)

Я использовал redux вот так (index.tsx):

 ReactDOM.render(  lt;Provider store={store}gt;  lt;App /gt;  lt;/Providergt;,  document.getElementById('root') );   

и создал файл store.tsx :

 export const store = configureStore({  reducer:{  adminLogin: adminLoginReducer,  userRequests: userRequestsReducer,  } }); export type RootState = ReturnTypelt;typeof store.getStategt; export type AppDispatch = typeof store.dispatch  

и создал loginstore.tsx (reudcer) вот так:

 export const adminLoginThunk = createAsyncThunk(  "adminLoginThunk",  async (arg:{  body: RequestType_AdminLogin,   unmounted: React.MutableRefObjectlt;booleangt;,   cancellationToken: CancelToken  },thunkAPI) =gt; {  return await callAPIlt;ResponseType_AdminLogingt;  ("paneladmin/login",'post',{},arg.body,[],{},arg.unmounted,arg.cancellationToken).then(res=gt;res.data.Result);  } );  export interface AdminLoginState {  token:string,  loading: boolean,  InitialLoad:boolean  }   const initialState = {  token:"",  loading:false,  InitialLoad:false } as AdminLoginState;    const adminSlice = createSlice({  name: "AdminLoginState",  initialState,  reducers:{  getToken: (state) =gt; {  state.token = localStorage.getItem('token') || "";  state.InitialLoad = true;  },  removeToken: (state) =gt; {  localStorage.removeItem('token');  state.token = "";  },  },  extraReducers: (builder) =gt; {  builder.addCase(adminLoginThunk.pending, (state, action:PayloadActionlt;anygt;) =gt; {  state.loading = true  });  builder.addCase(adminLoginThunk.fulfilled, (state, action:PayloadActionlt;anygt;) =gt; {  state.loading = false;  localStorage.setItem("token",action.payload)  state.token = action.payload as string;  });  builder.addCase(adminLoginThunk.rejected, (state, action:PayloadActionlt;anygt;) =gt; {  state.loading = false;  })  } });    export const { getToken, removeToken } = adminSlice.actions  export default adminSlice.reducer;  

и я использовал эти две строки в компоненте app.tsx(ошибка связана с начальной загрузкой) :

 const InitialLoad = useSelector((state:RootState) =gt; state.adminLogin.InitialLoad);  const dispatch = useDispatch();