React-Redux / Redux: обновление магазина из внешней функции

Question

Итак, я пытаюсь обновить магазин и мой компонент из отдельного файла JavaScript, но у меня немного проблемы.

Функция, которую я вызываю, работает в компоненте, но не изфайл, который я бы хотел.Это имеет смысл, и я думаю, что я близок, я просто хотел бы немного помочь разобраться с этим!

Вот код: https://codesandbox.io/s/reactredux-o5wbq

Если выоткрыть page.js вы увидите компонент страницы, который имеет две кнопки с функциями onClick.При щелчке значение h1 изменяется - Это работает, как и ожидалось.

Теперь, если вы откроете newfile.jsx (входит в index.js), я установил тайм-аут на 2,5 секунды, который вызывает функцию успеха вactions.js.Функция работает успешно, поскольку она регистрирует «УСПЕХ».Но, насколько я могу судить, магазин не обновляет и не отображает текст h1 на странице.

Как я уже сказал, я думаю, по крайней мере, я надеюсь, что я близок.Но я действительно застрял в том, куда мне нужно идти отсюда.Любая помощь могла бы быть полезна.Спасибо!

Код: Ниже показано, что, кажется, работает неправильно

import { successAction, errorAction } from "./actions";

setTimeout(function() {
  console.log("Timeout Complete");
  successAction();
}, 2500);

У меня есть следующее вмой фактический компонент, и я думаю, что это может быть то, что я скучаю.Я просто не знаю, как отформатировать его так, чтобы он работал в newfile.jsx.Насколько я могу судить, это как-то встроено в способ экспорта компонента.

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

const mapDispatchToProps = dispatch => ({
  successAction: () => dispatch(successAction()),
  errorAction: () => dispatch(errorAction())
});

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

Я пытался добавить ниже к newfile.jsx, но это не сработало.

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

const mapDispatchToProps = dispatch => ({
  successAction: () => dispatch(successAction()),
  errorAction: () => dispatch(errorAction())
});

connect(
  mapStateToProps,
  mapDispatchToProps
);

Answer 1

Импорт магазина в вашем newFile.jsx и отправка оттуда.

import { successAction, errorAction } from "./actions";
import store from "./store";

setTimeout(function() {
  console.log("Timeout Complete");
  store.dispatch( successAction() );
}, 2500);