mapDispatchToProps 传递未定义的道具

Question

我有一个看似微不足道的问题，但我终究无法解决。

FooContainer.tsx

...
public render() {
  ...

  this.props.onSubmit(123) // FooContainer.tsx:81 Uncaught TypeError: this.props.onSubmit is not a function
}
...
export interface FooDispatchToProps {
  onSubmit: (bar: number) => Thunk; // <- from redux-thunk
}
const mapDispatchToProps = {
  onSubmit: submitFoo, // a thunk. From SomeDuck.ts
};   
export const FooContainerConnected = connect<{}, FooDispatchToProps, {}>(
    undefined,
    mapDispatchToProps,
)(FooContainer);

SomeDuck.ts

export function submitFoo(bar: number): Thunk {
    return (dispatch, getState) => {
        dispatch(submitFooAction(bar));
    };
}

道具没有通过 mapDispatchToProps 的这种 shorthand 表示法传递。如果我使用 mapDispatchToProps 的完整样板格式，那么道具将被传递。

我在这里没有看到什么？

Answer 1

好的，所以我做了更多的挖掘，发现存在循环依赖。

Utils ==> FooContainer ==> Ducks ==> Utils

消除这种依赖性消除了 ducks 中的函数最初未定义的问题

希望遇到类似问题的人看到这个答案可以放心。 :)

mapDispatchToProps 传递未定义的道具

mapDispatchToProps passess undefined props

reactjs

redux

redux-thunk