с помощьюact-redux соединяется с машинописью

Question

Я пытаюсь использовать React-redux connect с машинописью.Я запутался в использовании connect с withRouter.

Я пытаюсь использовать его как

withRouter<any>(connect<{},ComponentProps,{}>(
    matchStateToProps, 
    matchDispatchToProps
)(Component));

При попытке передать свойство productList, которое он выдает,

TS2339: свойство 'productList' не существует для типа 'IntrinsicAttributes & IntrinsicClassAttributes, ComponentState >> & Rea ...

Но в другом компоненте,

withRouter<any>(connect<{}, ComponentProps, {}>(
    mapStateToProps, 
    mapDispatchToProps
)(Component));

Работает просто отлично.ComponentProps содержит все свойства компонента.(включая stateProps, dispatchProps, RouteProps и собственные реквизиты).

Как использовать connect в машинописном тексте с реагированием withRouter?Что я должен передать в качестве реквизита для withRouter & connect?

Answer 1

После некоторой проблемы я смог заставить это работать!

// assuming all these interfaces are well defined somewhere.
type MyComponentProps = OwnProps & ComposeProps & StateProps & DispatchProps;

// the secret sauce, need to define a class constructor to pass to compose
interface MyComponentClass<MyComponentProps> extends React.ComponentClass {
  new (props: MyComponentProps): React.Component<MyComponentProps>;
}

export class MyComponent extends React.Component<MyComponentProps> {
  ...
}

export default compose<MyComponentClass<MyComponentProps>>(
  withSomeHOC(),
  connect<StateProps, DispatchProps, OwnProps>(mapStateToProps, mapDispatchToProps)
)(MyComponent);

Вышеприведенное позволит вам импортировать составной компонент и поддерживать безопасность типов!

Answer 2

Я делаю это так:

import { compose } from 'redux';

тогда:

export default compose<React.ComponentClass>(
  withRouter,
  connect<IMapStateToProps, IMapDispatchToProps, IConnectedRouterProps>(
    mapStateToProps,
    {
      fetchComponentData
    },
  ),
)(Component);