mirror of
https://github.com/zhigang1992/DefinitelyTyped.git
synced 2026-05-31 03:02:04 +08:00
[react-redux] Expose dispatch with props (#16652)
This commit is contained in:
41
types/react-redux/index.d.ts
vendored
41
types/react-redux/index.d.ts
vendored
@@ -15,17 +15,16 @@ type Store<S> = Redux.Store<S>;
|
||||
type Dispatch<S> = Redux.Dispatch<S>;
|
||||
type ActionCreator<A> = Redux.ActionCreator<A>;
|
||||
|
||||
interface ComponentDecorator<TOwnProps, TMergedProps> {
|
||||
(component: Component<TMergedProps>): ComponentClass<TOwnProps>;
|
||||
export interface DispatchProp<T> {
|
||||
dispatch: Dispatch<T>
|
||||
}
|
||||
|
||||
/**
|
||||
* Decorator that infers the type from the original component
|
||||
*
|
||||
* Can't use the above decorator because it would default the type to {}
|
||||
*/
|
||||
export interface InferableComponentDecorator<TOwnProps> {
|
||||
<T extends Component<TOwnProps>>(component: T): T;
|
||||
interface ComponentDecorator<TMergedProps> {
|
||||
<TOwnProps>(component: Component<(TOwnProps & TMergedProps) | TOwnProps>): ComponentClass<TOwnProps>;
|
||||
}
|
||||
|
||||
interface ComponentMergeDecorator<TMergedProps, TOwnProps> {
|
||||
(component: Component<TMergedProps>): ComponentClass<TOwnProps>;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -47,73 +46,73 @@ export interface InferableComponentDecorator<TOwnProps> {
|
||||
* @param mergeProps
|
||||
* @param options
|
||||
*/
|
||||
export declare function connect<TOwnProps>(): InferableComponentDecorator<TOwnProps>;
|
||||
export declare function connect(): ComponentDecorator<DispatchProp<any>>;
|
||||
|
||||
export declare function connect<TStateProps, no_dispatch, TOwnProps>(
|
||||
mapStateToProps: MapStateToPropsParam<TStateProps, TOwnProps>
|
||||
): ComponentDecorator<TOwnProps, TStateProps & TOwnProps>;
|
||||
): ComponentDecorator<DispatchProp<any> & TStateProps>;
|
||||
|
||||
export declare function connect<no_state, TDispatchProps, TOwnProps>(
|
||||
mapStateToProps: null | undefined,
|
||||
mapDispatchToProps: MapDispatchToPropsParam<TDispatchProps, TOwnProps>
|
||||
): ComponentDecorator<TOwnProps, TDispatchProps & TOwnProps>;
|
||||
): ComponentDecorator<TDispatchProps & TOwnProps>;
|
||||
|
||||
export declare function connect<TStateProps, TDispatchProps, TOwnProps>(
|
||||
mapStateToProps: MapStateToPropsParam<TStateProps, TOwnProps>,
|
||||
mapDispatchToProps: MapDispatchToPropsParam<TDispatchProps, TOwnProps>
|
||||
): ComponentDecorator<TOwnProps, TStateProps & TDispatchProps & TOwnProps>;
|
||||
): ComponentDecorator<TStateProps & TDispatchProps>;
|
||||
|
||||
export declare function connect<TStateProps, no_dispatch, TOwnProps, TMergedProps>(
|
||||
mapStateToProps: MapStateToPropsParam<TStateProps, TOwnProps>,
|
||||
mapDispatchToProps: null | undefined,
|
||||
mergeProps: MergeProps<TStateProps, undefined, TOwnProps, TMergedProps>,
|
||||
): ComponentDecorator<TOwnProps, TMergedProps>;
|
||||
): ComponentMergeDecorator<TMergedProps, TOwnProps>;
|
||||
|
||||
export declare function connect<no_state, TDispatchProps, TOwnProps, TMergedProps>(
|
||||
mapStateToProps: null | undefined,
|
||||
mapDispatchToProps: MapDispatchToPropsParam<TDispatchProps, TOwnProps>,
|
||||
mergeProps: MergeProps<undefined, TDispatchProps, TOwnProps, TMergedProps>,
|
||||
): ComponentDecorator<TOwnProps, TMergedProps>;
|
||||
): ComponentMergeDecorator<TMergedProps, TOwnProps>;
|
||||
|
||||
export declare function connect<no_state, no_dispatch, TOwnProps, TMergedProps>(
|
||||
mapStateToProps: null | undefined,
|
||||
mapDispatchToProps: null | undefined,
|
||||
mergeProps: MergeProps<undefined, undefined, TOwnProps, TMergedProps>,
|
||||
): ComponentDecorator<TOwnProps, TMergedProps>;
|
||||
): ComponentMergeDecorator<TMergedProps, TOwnProps>;
|
||||
|
||||
export declare function connect<TStateProps, TDispatchProps, TOwnProps, TMergedProps>(
|
||||
mapStateToProps: MapStateToPropsParam<TStateProps, TOwnProps>,
|
||||
mapDispatchToProps: MapDispatchToPropsParam<TDispatchProps, TOwnProps>,
|
||||
mergeProps: MergeProps<TStateProps, TDispatchProps, TOwnProps, TMergedProps>,
|
||||
): ComponentDecorator<TOwnProps, TMergedProps>;
|
||||
): ComponentMergeDecorator<TMergedProps, TOwnProps>;
|
||||
|
||||
export declare function connect<TStateProps, no_dispatch, TOwnProps>(
|
||||
mapStateToProps: MapStateToPropsParam<TStateProps, TOwnProps>,
|
||||
mapDispatchToProps: null | undefined,
|
||||
mergeProps: null | undefined,
|
||||
options: Options
|
||||
): ComponentDecorator<TOwnProps, TStateProps & TOwnProps>;
|
||||
): ComponentDecorator<DispatchProp<any> & TStateProps & TOwnProps>;
|
||||
|
||||
export declare function connect<no_state, TDispatchProps, TOwnProps>(
|
||||
mapStateToProps: null | undefined,
|
||||
mapDispatchToProps: MapDispatchToPropsParam<TDispatchProps, TOwnProps>,
|
||||
mergeProps: null | undefined,
|
||||
options: Options
|
||||
): ComponentDecorator<TOwnProps, TDispatchProps & TOwnProps>;
|
||||
): ComponentDecorator<TDispatchProps>;
|
||||
|
||||
export declare function connect<TStateProps, TDispatchProps, TOwnProps>(
|
||||
mapStateToProps: MapStateToPropsParam<TStateProps, TOwnProps>,
|
||||
mapDispatchToProps: MapDispatchToPropsParam<TDispatchProps, TOwnProps>,
|
||||
mergeProps: null | undefined,
|
||||
options: Options
|
||||
): ComponentDecorator<TOwnProps, TStateProps & TDispatchProps & TOwnProps>;
|
||||
): ComponentDecorator<TStateProps & TDispatchProps>;
|
||||
|
||||
export declare function connect<TStateProps, TDispatchProps, TOwnProps, TMergedProps>(
|
||||
mapStateToProps: MapStateToPropsParam<TStateProps, TOwnProps>,
|
||||
mapDispatchToProps: MapDispatchToPropsParam<TDispatchProps, TOwnProps>,
|
||||
mergeProps: MergeProps<TStateProps, TDispatchProps, TOwnProps, TMergedProps>,
|
||||
options: Options
|
||||
): ComponentDecorator<TOwnProps, TMergedProps>;
|
||||
): ComponentMergeDecorator<TMergedProps, TOwnProps>;
|
||||
|
||||
interface MapStateToProps<TStateProps, TOwnProps> {
|
||||
(state: any, ownProps?: TOwnProps): TStateProps;
|
||||
|
||||
@@ -2,7 +2,7 @@ import { Component, ReactElement } from 'react';
|
||||
import * as React from 'react';
|
||||
import * as ReactDOM from 'react-dom';
|
||||
import { Store, Dispatch, bindActionCreators } from 'redux';
|
||||
import { connect, Provider } from 'react-redux';
|
||||
import { connect, Provider, DispatchProp } from 'react-redux';
|
||||
import objectAssign = require('object-assign');
|
||||
|
||||
//
|
||||
@@ -108,8 +108,11 @@ declare var store: Store<TodoState>;
|
||||
class MyRootComponent extends Component<any, any> {
|
||||
|
||||
}
|
||||
class TodoApp extends Component<any, any> {
|
||||
|
||||
class TodoApp extends Component<DispatchProp<any>, any> {
|
||||
render (): null {
|
||||
this.props.dispatch({ type: 'test' })
|
||||
return null
|
||||
}
|
||||
}
|
||||
interface TodoState {
|
||||
todos: string[]|string;
|
||||
@@ -153,7 +156,9 @@ ReactDOM.render(
|
||||
|
||||
// Inject just dispatch and don't listen to store
|
||||
|
||||
connect()(TodoApp);
|
||||
const WrappedTodoApp = connect()<{}>(TodoApp);
|
||||
|
||||
<WrappedTodoApp />
|
||||
|
||||
// Inject dispatch and every field in the global state
|
||||
|
||||
@@ -261,7 +266,7 @@ function mergeProps(stateProps: TodoState, dispatchProps: DispatchProps, ownProp
|
||||
});
|
||||
}
|
||||
|
||||
connect(mapStateToProps2, actionCreators, mergeProps)(TodoApp);
|
||||
connect(mapStateToProps2, actionCreators, mergeProps)(MyRootComponent);
|
||||
|
||||
|
||||
//https://github.com/DefinitelyTyped/DefinitelyTyped/issues/14622#issuecomment-279820358
|
||||
@@ -280,7 +285,7 @@ class TestComponent extends Component<TestProp, TestState> { }
|
||||
const WrappedTestComponent = connect()(TestComponent);
|
||||
|
||||
// return value of the connect()(TestComponent) is of the type TestComponent
|
||||
let ATestComponent: typeof TestComponent = null;
|
||||
let ATestComponent: React.ComponentClass<TestProp> = null;
|
||||
ATestComponent = TestComponent;
|
||||
ATestComponent = WrappedTestComponent;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user