相关疑难解决方法(0)

MapDispatchToProps导致父组件中的Typescript错误,期望Action作为props传递

在我的子组件中,我正在定义MapDispatchToProps,将它们传递到connect中,并相应地定义一个接口PropsFromDispatch,该接口在React.Component Props接口中进行了扩展。现在,在我的父组件中,Typescript告诉我它缺少我在PropsFromDispatch中定义的属性。

这似乎并不完全荒谬,因为我将它们定义为React.Component Props接口的一部分,但是我希望'connect'能够像处理PropsFromState一样来处理它。不必从父组件传递到子组件,而是从州映射到道具。

/JokeModal.tsx

...

interface Props extends PropsFromState, PropsFromDispatch {
    isOpen: boolean
    renderButton: boolean
}

...

const mapDispatchToProps = (dispatch: Dispatch<any>): 
PropsFromDispatch => {
    return {
        tellJoke: (newJoke: INewJoke) => dispatch(tellJoke(newJoke)),
        clearErrors: () => dispatch(clearErrors())
    }
}

interface PropsFromDispatch {
    tellJoke: (newJoke: INewJoke) => void
    clearErrors: () => void
}

...

export default connect(mapStateToProps, mapDispatchToProps)(JokeModal);
Run Code Online (Sandbox Code Playgroud)

/Parent.tsx

...

button = <JokeModal isOpen={false} renderButton={true} /> 
...
Run Code Online (Sandbox Code Playgroud)

在/Parent.tsx的这一行中,Typescript现在告诉我:

Type '{ isOpen: false; renderButton: true; }' is missing the 
following properties from …
Run Code Online (Sandbox Code Playgroud)

typescript reactjs redux redux-thunk react-redux

5
推荐指数
1
解决办法
1260
查看次数

标签 统计

react-redux ×1

reactjs ×1

redux ×1

redux-thunk ×1

typescript ×1