React-Redux Toolkit状态未更新，注册组件数据无法存入Store求助

• 表单取值错误：你当前从document.forms[0]获取的name和password是DOM输入元素对象，并非用户输入的实际文本值。正确的做法是提取元素的value属性：

  const handleSubmit = (event) => {
    event.preventDefault();
    const { name, password } = document.forms[0];
    dispatch(changeInfo(name.value, password.value));
  };
  

  若直接传递DOM元素，action的payload会是元素对象，reducer无法正确解析为用户名和密码，导致状态无变化。

• Action Creator参数处理不当：检查changeInfo这个action creator的定义，确认它能正确接收参数并构造有效payload。比如在RTK的createSlice中，若reducer期望接收包含name和password的对象，调用时需将参数打包：

  // 调用时调整为
  dispatch(changeInfo({ name: name.value, password: password.value }));
  

  对应的slice reducer应这样处理：

  const userSlice = createSlice({
    name: 'user',
    initialState: { name: '', password: '' },
    reducers: {
      changeInfo: (state, action) => {
        state.name = action.payload.name;
        state.password = action.payload.password;
      }
    }
  });
  

  若坚持传递两个独立参数，需在action creator中使用prepare函数来构造payload。

• Store集成不完整：确认你的应用已通过Provider包裹，且store包含了对应的user reducer。入口文件示例：

  import { Provider } from 'react-redux';
  import store from './store';
  
  ReactDOM.render(
    <Provider store={store}>
      <App />
    </Provider>,
    document.getElementById('root')
  );
  

  若SignUp组件不在Provider的作用范围内，useDispatch获取的dispatch不会作用于目标store，状态自然无法更新。

• Reducer逻辑错误：检查slice中changeInfo对应的reducer，确保它正确更新了state。比如是否写错了state的属性名，或是未正确修改状态（即便RTK的Immer允许直接修改，逻辑错误仍会导致状态无变化）。

内容的提问来源于stack exchange，提问作者Vasilii Vakhton