类型'typeof C：/ Users/pfftd/projectcrystal/src/actions/crystalActions'的参数不能分配给类型为'ActionCreatorsMapObject'的参数）

Question

一直试图找出过去2-3小时的情况。 该应用程序从在浏览器上运行开始，显示this.props.fetchAPOD不是一个函数（屏幕截图位于最下方），但它显然在我的动作创建者中。同样在我的容器中，当我将动作分配给mapDisPatchToProps时，错误提示“类型参数”typeof“C：/ Users/pfftd/projectcrystal/src/actions/crystalActions”'不能分配给类型为“ActionCreatorsMapObject”的参数这是完全相同的代码，我在微软的反应看/打字稿启动工具包指南：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 （文件包含存储和提供者）

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';

岂不是

import Crystal from './containers/Crystal';

它看起来像您不使用容器组成部分，是不是使用表象一个