react-redux-typescriptで小道具を渡す方法

Question

私はtypescriptを使うときにどのように小道具をコンポーネントに渡すかを考えようとしています。

ローカルの状態であろうと、{...this.props}以外のものであれ、どこの支柱をどこに通してもエラーが発生します。しかし、もし私がこれを打ち倒すならば、私は相手が望むものを手に入れません。代わりに、私は履歴、場所、該当するデフォルトとの一致、およびstaticContext：undefinedを取得します。私が下の私の例のように行動を伝えようとすると、それは未定義になるでしょう。私はonComponentDidMount(){}でthis.props.actionsをログインしたとき、ホームコンポーネントで

import * as React from 'react'; 
import * as HomeActions from '../../actions/home'; 
import * as style from './style.css'; 
import { bindActionCreators } from 'redux'; 
import { connect } from 'react-redux'; 
import { RouteComponentProps } from 'react-router'; 
import { RootState } from '../../reducers'; 
import Home from '../../components/Home'; 

export namespace App { 
    export interface Props extends RouteComponentProps<void> { 
    actions: typeof HomeActions 
    } 

    export interface State { 
    /* empty */ 
    } 
} 

export class App extends React.Component<App.Props, App.State> { 

    render() { 
    return (
     <div> 
     <Home {...this.props} actions={this.props.actions}/> 
     {this.props.children} 
     </div> 
    ); 
    } 
} 

function mapStateToProps(state: RootState) { 
    return { 
    home: state.home 
    }; 
} 

function mapDispatchToProps(dispatch) { 
    return { 
    actions: bindActionCreators(HomeActions as any, dispatch) 
    }; 
} 

connect(mapStateToProps, mapDispatchToProps); 

：

私は結果として取得エラーが

client:157 [at-loader] ./src/containers/App/index.tsx:25:31 TS2339: Property 'actions' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<Home> & Readonly<{ children?: ReactNode; }> & Read...'.

マイApp.tsxは以下ですそれから私は未定義になる。

Answer 1

コンポーネントをconnectに渡し、接続されたコンポーネントをコンポーネントの代わりにエクスポートする必要があります。

export connect(mapStateToProps, mapDispatchToProps)(App);