React-Redux не диспетчерский тип действия - PullRequest
Новая
       48

React-Redux не диспетчерский тип действия

0 голосов
/ 21 января 2020

Вот приложение «Реакция / Избыток». Это базовая c урезанная версия того, что я пытаюсь выполнить sh. showFolder () создает список папок и кнопку для щелчка, где она вызывает действие removeFolder из FolderActions. js. Кнопка работает и будет вызывать функцию в FolderActions. js однако не будет отправлять тип. Функции работают так, как я вижу сообщение console.log, но не буду отправлять тип с использованием приставки ..

У меня сильное чувство, что я вызываю функцию так, как я сейчас потерян 

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
);

Действия папки. 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);
    });
};

Ответы [ 2 ]

1 голос
/ 21 января 2020

Ваш вызов функции выглядит странно для меня ...

Можете ли вы попытаться определить правильный mapDispatchToProps и вызвать dispatch внутри этого, а не внутри вашей функции? 

const mapDispatchToProps = dispatch => ({
  removeFolder: (id) => dispatch( removeFolder(id) ),
  addFolder: (id) => dispatch( addFolder(id) ),
  getFolder: (id) => dispatch( getFolder(id) ),
})

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

export const removeFolder = id => {
  // code block
};

Я знаю, что это скорее доработка, на которую вы, вероятно, надеялись, но работает ли она?

0 голосов
/ 21 января 2020

Исправьте меня, если я ошибаюсь, но мой сервер никогда не отправлял ответ.

Поскольку сервер никогда не отправлял ответ, когда я сделал запрос, res не соответствует истине, поэтому не может отправить тип и полезную нагрузку.

Прошу прощения за трату времени людей!

...