Connected container components further down the tree? | بلاگ

Connected container components further down the tree?

تعرفه تبلیغات در سایت

آخرین مطالب

امکانات وب

Vote count: 0

Currently I have a single container at the top level and state is passed via props down the tree. This is quickly becoming cumbersome and I want to have multiple container components as needed. When I try this it seems they aren't connected to the top level redux store.

Example:

App.tsx

import * as React from 'react';
import { Provider } from 'react-redux';
import { store } from './reduxStore';


  

Further down the tree from PageContainer I want to have EditorContainer.tsx work

import { connect } from 'react-redux';
import { codeBooksAction, CodeBooksModalOptions } from '../../../actions/codeBooks';
import { Editor } from './Editor';

const mapDispatchToProps = (dispatch) => ({
  showModal: (opts: CodeBooksModalOptions) => dispatch(codeBooksAction(opts)),
});

export const EditorContainer = connect(
  mapDispatchToProps,
)(Editor);

Editor.tsx

export interface EditorProps {
  showModal: (opts: CodeBooksModalOptions) => void;
}

export class Editor extends React.Component {
  ...
}

The problem is that when I try to use showModal I get TypeError: dispatch is not a function from:

const mapDispatchToProps = (dispatch) => ({
  showModal: (opts: CodeBooksModalOptions) => dispatch(codeBooksAction(opts)),
});

Do I have to do more than use ? I shouldn't be using another , right? I've had a hard time finding any examples of multiple redux-connected containers throughout an application.

Help appreciated

asked 42 secs ago
ryan

...
نویسنده : استخدام کار بازدید : 0 تاريخ : چهارشنبه 31 مرداد 1397 ساعت: 0:27