如何通过redux使用html <form>？

npm install redux react-redux

import { createStore } from 'redux';

const initialState = {
  formData: {}
};

function formReducer(state = initialState, action) {
  switch (action.type) {
    case 'UPDATE_FORM_DATA':
      return {
        ...state,
        formData: {
          ...state.formData,
          [action.payload.name]: action.payload.value
        }
      };
    default:
      return state;
  }
}

const store = createStore(formReducer);

import React from 'react';
import { Provider } from 'react-redux';
import { store } from './store';
import FormComponent from './FormComponent';

function App() {
  return (
    <Provider store={store}>
      <FormComponent />
    </Provider>
  );
}

export default App;

import React from 'react';
import { connect } from 'react-redux';

function FormComponent({ formData, updateFormData }) {
  const handleInputChange = (event) => {
    const { name, value } = event.target;
    updateFormData(name, value);
  };

  return (
    <form>
      <input type="text" name="username" value={formData.username} onChange={handleInputChange} />
      <input type="password" name="password" value={formData.password} onChange={handleInputChange} />
    </form>
  );
}

const mapStateToProps = (state) => ({
  formData: state.formData
});

const mapDispatchToProps = (dispatch) => ({
  updateFormData: (name, value) => dispatch({ type: 'UPDATE_FORM_DATA', payload: { name, value } })
});

export default connect(mapStateToProps, mapDispatchToProps)(FormComponent);