'typeof C：/ Users/pfftd/projectcrystal/src/actions/crystalActions'の引数は 'ActionCreatorsMapObject'タイプのパラメータに割り当てられません）

Question

過去2〜3時間の間にこれを理解しようとしました。 このアプリはブラウザから起動し、this.props.fetchAPODが機能ではないというエラーを表示します（一番下のスクリーンショット）が、私のアクションクリエイターにはっきりとあります。また、私のコンテナでは、 "引数のtypeof" C：/ Users/pfftd/projectcrystal/src/actions/crystalActions "という型が 'ActionCreatorsMapObject'型のパラメータに割り当てられないというエラーが表示されます。このアクションをmapDisPatchToPropsに割り当てますここでhttps://github.com/Microsoft/TypeScript-React-Starter

は私のコードは次のとおりです：

コンテナCrystal.tsx

import { connect } from 'react-redux'; 
import { bindActionCreators } from 'redux'; 
import Crystal from '../components/Crystal'; 
import * as actions from '../actions/crystalActions'; 
import { 
    ApodSTATE 
} from '../types'; 

export function mapStateToProps({ APOD }: ApodSTATE) { 
    return { 
    APOD 
    }; 
} 

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

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

App.tsx私はMicrosoftの反応/ typescriptですスタートキットガイドでご覧同じEXACTコードはあります（ファイルストアプロバイダ）が含ま

import * as React from 'react'; 
import { createStore, applyMiddleware } from 'redux'; 
import { Provider } from 'react-redux'; 
import thunk from 'redux-thunk'; 
import { createLogger } from 'redux-logger'; 

import allReducers from './reducers'; 
import Crystal from './components/Crystal'; 
// import { ApodSTATE } from './types'; 

const logger = createLogger({ 
    level: 'info', 
    collapsed: true 
}); 

const store: any = createStore(allReducers, applyMiddleware(thunk, logger)); 


class App extends React.Component<any, any> { 
    render() { 
    return (
     <Provider store={store}> 
     <Crystal /> 
     </Provider> 
    ); 
    } 
} 

export default App; 

crystalActions.tsx

export const FETCH_APOD = 'FETCH_APOD'; 
export type FETCH_APOD = typeof FETCH_APOD; 
export interface FetchApod { type: FETCH_APOD }; 

export const fetchAPOD =() => { 
    return (dispatch: any) => { 
    dispatch({ 
     type: FETCH_APOD 
    }); 
    }; 
}; 

タイプ（index.tsx）

export interface TableName { 
    TableName: string; 
} 

export interface ApodACTIONS { 
    type: string; 
    fetchAPOD?:() => {}; 
}; 

export interface ApodSTATE { 
    APOD: {}; 
} 

export enum actionTypes { 
    FETCH_APOD 
} 

成分Crystal.tsx

よく見るのの

import * as React from 'react'; 
// import { ApodSTATE } from '../types'; 


class Crystal extends React.Component<any, any> { 
    constructor(props: any) { 
    super(props); 
    this.printTest = this.printTest.bind(this); 
    } 
    componentDidMount() { 
    this.printTest(); 
    this.props.fetchAPOD(); 
    } 
    printTest() { 
    setTimeout(() => { 
     console.log(this.props); 
    }, 1500); 
    } 

    render() { 
    return (
     <div> 
     <h2>Project Crystal initiation</h2> 
     <h3>Test</h3> 
     </div> 
    ); 
    } 
} 

export default Crystal; 

スクリーンショット：

Answer 1

あなたは右の部品を輸入していますか？ App.tsxでは、

import Crystal from './components/Crystal';

それはあなたがコンテナコンポーネントを使用していないし、代わりにプレゼンテーション1