我正在使用redux和redux-thunk与typescript.我试图通过connect()注入一个组件,一个简单的thunk动作创建者,使用mapDispatchToProps.
操作
export enum TestActionTypes {
THUNK_ACTION = "THUNK_ACTION"
}
export interface ThunkAction {
type: TestActionTypes.THUNK_ACTION;
}
export type TestAction = ThunkAction;
Run Code Online (Sandbox Code Playgroud)
动作创作者
export function thunkActionCreator() {
return function(dispatch: Dispatch<any>) {
dispatch({ type: TestAction.THUNK_ACTION });
};
Run Code Online (Sandbox Code Playgroud)
连接组件
interface DemoScreenState {}
interface OwnProps {}
interface StateProps {}
interface DispatchProps {
testThunk: () => void;
}
type DemoScreenProps = StateProps & DispatchProps & OwnProps;
class DemoScreen extends React.Component<
DemoScreenProps,
DemoScreenState
> {
constructor(props: DemoScreenProps) {
super(props);
}
componentDidMount() {
this.props.testThunk();
}
render() …Run Code Online (Sandbox Code Playgroud) 我想从子组件中调用一个方法,按照这里的建议从父组件中调用子方法
但是,当子组件用react-redux的connect包裹起来时,它不起作用,如下例所示:
子组件
interface OwnProps {
style?: any;
}
interface ReduxStateProps {
category: string;
}
interface DispatchProps {
updateTimestamp: (timestamp: Date) => void;
}
type Props = ReduxStateProps & DispatchProps & OwnProps;
interface State {
timestamp?: Date;
}
class ChildComponent extends React.Component<Props, State> {
childMethod = () => {
console.log("I am the child");
};
render(){
<Text>Debug</Text>
}
}
function mapStateToProps(state: any): ReduxStateProps {
return {
category: state.menu.category
};
}
function mapDispatchToProps(dispatch: Dispatch<any>): DispatchProps {
return {
updateTimestamp: …Run Code Online (Sandbox Code Playgroud)