React-Native Redux注册表单Reducer未触发，状态无法更新求助

Let's break down the key issues keeping your reducer from updating state, even though you’ve confirmed actions are executing:

1. Incorrect Callback Binding in the SignUpForm Component #

In your SignUpForm.js render method, you’re directly calling the imported raw action creators instead of using the dispatch-bound versions provided by your component props. This means actions are being created, but never sent to the Redux store—so your reducer never receives them to update state.

Fix: Reference the Component’s Bound Action Methods #

Update your SignupForm props to use the component’s class methods (which call the props-bound action creators):

render() {
  console.log(this.props)
  return (
    <SignupForm
      onName={(text) => this.enterName(text)}
      onEmail={(text) => this.enterEmail(text)}
      onNumber={(text) => this.enterNumber(text)}
      onSubmit={() => this._onSubmitForm()}
    >
    </SignupForm>
  )
}

Even cleaner: You can pass the props directly (since connect already binds them to dispatch):

render() {
  console.log(this.props)
  return (
    <SignupForm
      onName={this.props.enterName}
      onEmail={this.props.enterEmail}
      onNumber={this.props.enterNumber}
      onSubmit={this._onSubmitForm}
    >
    </SignupForm>
  )
}

(Your _onSubmitForm is already an arrow function, so no extra binding is needed here.)

2. Missing Payload in Axios POST Request #

While this doesn’t fix the reducer state issue, your backend won’t receive user data because you’re not passing userData to the axios post call. Update the action creator:

export const singupDetails = ({ name, no, email }) => {
  let userData = { name, no, email }
  console.log('signupDataTest',userData);
  return (dispatch) => {
    // Add userData as the second parameter to send it to your backend
    axios.post('http://192.178.43.226/testProject/signup.php', userData)
      .then((response) => {
        console.log('signup', response);
        dispatch({ type: ADD_CUSTOMER_DETAILS, payload: response.data });
      })
      .catch((error) => {
        console.log(error);
      });
  };
};

3. Optional: Fix Spelling Consistency #

You have a typo in singupDetails (missing an 'n'—should be signupDetails). This isn’t breaking your code right now (you’re consistent with the typo across files), but fixing it will make your code more readable and prevent future confusion.

Verify the Fix #

After making these changes:

• Check your console logs to confirm the reducer’s console.log('signup',action); triggers when you update form fields.
• The this.props in your SignUp component should show updated name, email, and no values as you type.

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