React-Redux不分派动作类型

Question

这里是react / redux应用程序。这是我要完成的基本精简版本。 showFolder（）生成一个文件夹列表和一个按钮，以单击它从FolderActions.js调用removeFolder动作的位置。该按钮起作用，并且将在FolderActions.js中调用该函数，但是不会调度该类型。该函数可以正常工作，就像我看到的console.log消息一样，但不会使用redux来分派类型。

我有一种强烈的感觉，这就是我调用函数的方式，但此刻我迷路了

import {
  addFolder,
  getFolder,
  removeFolder,

} from "../../../actions/FolderActions";

class Folders extends Component {

  onRemoveFolder = (e,id) => {
    e.preventDefault();
    console.log(id);
    this.props.removeFolder(id);
  };

  showFolders = () => {
    return (
      <ul>
        {this.props.folder.map((key, index) => (          
            <form onSubmit={(e) => this.onRemoveFolder(e,key._id)}>
              <input type="submit"></input>
            </form>
        ))}
      </ul>
    );
  };

  render() {
    let { isShown } = this.state;
    return (
         <div>
          <div className="folder_names">{this.showFolders()}</div>
        </div> 
    );
  }
}
const mapStateToProps = state => {
  return {
    userId: state.auth.user._id,
    folder: state.folder.data
  };
};

export default connect(mapStateToProps, {removeFolder,addFolder,getFolder})(
  Folders
);
FolderActions.js

export const removeFolder = id => dispatch => {
  console.log("called")
  axios
    .delete(`api/folders/${id}`)
    .then(res =>
      dispatch({
        type: DELETE_FOLDER,
        payload: id
      })
    )
    .catch(err => {
      console.log(err);
    });
};

这里是react / redux应用程序。这是我要完成的基本精简版本。 showFolder（）会生成一个文件夹列表和一个按钮，以单击该文件夹以调用removeFolder ...

Answer 1

您的mapDispatchToProps看起来很奇怪。您实际上并没有调度到商店。