Reactjs 重排动作未击中减速器[反应]

正如标题所说，我的React应用程序出现了问题，我可以执行Redux操作，但之后它不会执行Redux操作。我已经看过了我以前参与的一个项目，以及这里的几篇文章，但我不确定我的代码有什么问题，它阻止了操作的进行。我已经粘贴了下面的代码，但是如果还有什么我可以提供的，请告诉我

index.js：

import React from 'react';
import ReactDom from 'react-dom';
import App from './components/App.jsx';
import { Provider } from 'react-redux';
import { createStore } from 'redux';
import reducer from './reducers/usersRedcuers';
import './index.css';

const store = createStore(reducer);

ReactDom.render(
    <Provider store={store}>
      <App />
    </Provider>, document.getElementById('root')
)

行动：

import {
  ADD_USER,
  DELETE_USER,
  LOGIN,
  LOGOUT,
  UPDATE_USER,
} from '../constants/constants';

export const login = (auth, token, password, username) => {
  const action = {
    type: LOGIN,
    auth,
    token,
    password,
    username,
  }
  console.log('login action:', action)
  return action;
}

减速器：

import {
  LOGIN,
  LOGOUT,
} from '../constants/constants';

const login = (action) => {
  console.log('hitting B')
  const { auth, token, password, username } = action;

  return {
    auth: auth,
    token: token,
    password: password,
    username: username,
  }
}

const authControl = (state = [], action) => {
  console.log('hitting C: ', action)
  let authControl = null;
  switch(action.type) {
    case LOGIN:
      authControl = [...state, login(action)]
      console.log('authControl:'. authControl);
      return authControl;
    default:
      console.log('hittibbng default', state)
      return state;
  }
}

export default authControl;

---

看来你没能送到减速机

import {
  ADD_USER,
  DELETE_USER,
  LOGIN,
  LOGOUT,
  UPDATE_USER,
} from '../constants/constants';

export const login = (auth, token, password, username) => dispatch => {
  const action = {
    type: LOGIN,
    auth,
    token,
    password,
    username,
  }
  console.log('login action:', action)
  dispatch(action)
}

---

在App.jsx组件中，您应该使用作为道具传递给组件的操作，而不是直接调用该操作

loginHandler应如下所示：

  loginHandler() {
    const { password, username } = this.state;
    const auth = Auth.isUserAuthenticated()
    const token = null;

    this.props.login(auth, token, password, username);   
  };

---

可能有一系列的可能性：#1检查

是否从“/reducers/usersRedcuers”导入reducer

实际上正在导入

authControl

#2） 检查您是否没有改变任何状态（您是否尝试在减速器中设置断点以确认它根本没有到达它？）这就成功了，谢谢！奇怪的是，如果您从Actions文件导入函数，为什么需要将其作为prop调用？需要为redux分派该操作，以便知道它必须更改存储。从actions文件调用函数时，您只是在创建表示该操作的对象，但redux不知道需要更改存储。我认为这会帮助你更好地理解它。

import {
  ADD_USER,
  DELETE_USER,
  LOGIN,
  LOGOUT,
  UPDATE_USER,
} from '../constants/constants';

export const login = (auth, token, password, username) => dispatch => {
  const action = {
    type: LOGIN,
    auth,
    token,
    password,
    username,
  }
  console.log('login action:', action)
  dispatch(action)
}

  loginHandler() {
    const { password, username } = this.state;
    const auth = Auth.isUserAuthenticated()
    const token = null;

    this.props.login(auth, token, password, username);   
  };