[inulax] connect API 支持forwardRef参数

This commit is contained in:
wangxinrong 2023-11-01 21:44:43 +08:00
parent cc49467c2f
commit 0636d8dab0
3 changed files with 20 additions and 16 deletions

View File

@ -20,13 +20,14 @@ import RouterContext from './context';
function withRouter<C extends ComponentType>(Component: C) {
function ComponentWithRouterProp(props: any) {
const { wrappedComponentRef, ...rest } = props;
const { history, location, match } = useContext(RouterContext);
const routeProps = { history: history, location: location, match: match };
return <Component {...props} {...routeProps} />;
return <Component {...routeProps} {...rest} ref={wrappedComponentRef} />;
}
return ComponentWithRouterProp;
}
export default withRouter;
export default withRouter;

View File

@ -24,13 +24,5 @@
"watch-test": "yarn test --watch --dev"
},
"files": ["build/@types", "build/cjs", "build/umd", "build/index.js", "build/jsx-dev-runtime.js", "build/jsx-runtime.js", "README.md"],
"types": "./build/@types/index.d.ts",
"exports": {
".": {
"default": "./index.js"
},
"./package.json": "./package.json",
"./jsx-runtime": "./jsx-runtime.js",
"./jsx-dev-runtime": "./jsx-dev-runtime.js"
}
"types": "./build/@types/index.d.ts"
}

View File

@ -17,6 +17,7 @@ import { useState, useContext, useEffect, useRef } from '../../renderer/hooks/Ho
import { createContext } from '../../renderer/components/context/CreateContext';
import { createElement } from '../../external/JSXElement';
import type { ReduxStoreHandler, ReduxAction, BoundActionCreator } from './redux';
import { forwardRef } from '../../renderer/components/ForwardRef';
const DefaultContext = createContext(null);
type Context = typeof DefaultContext;
@ -90,6 +91,11 @@ type MergePropsP<StateProps, DispatchProps, OwnProps, MergedProps> = (
type WrappedComponent<OwnProps> = (props: OwnProps) => ReturnType<typeof createElement>;
type OriginalComponent<MergedProps> = (props: MergedProps) => ReturnType<typeof createElement>;
type Connector<OwnProps, MergedProps> = (Component: OriginalComponent<MergedProps>) => WrappedComponent<OwnProps>;
type ConnectOption<State = any> = {
areStatesEqual?: (oldState: State, newState: State) => boolean;
context?: Context;
forwardRef?: boolean
}
export function connect<StateProps, DispatchProps, OwnProps, MergedProps>(
mapStateToProps: MapStateToPropsP<StateProps, OwnProps> = () => ({} as StateProps),
@ -97,12 +103,9 @@ export function connect<StateProps, DispatchProps, OwnProps, MergedProps>(
mergeProps: MergePropsP<StateProps, DispatchProps, OwnProps, MergedProps> = (
stateProps,
dispatchProps,
ownProps
ownProps,
): MergedProps => ({ ...stateProps, ...dispatchProps, ...ownProps } as unknown as MergedProps),
options?: {
areStatesEqual?: (oldState: any, newState: any) => boolean;
context?: Context;
}
options: ConnectOption,
): Connector<OwnProps, MergedProps> {
if (!options) {
options = {};
@ -159,6 +162,7 @@ export function connect<StateProps, DispatchProps, OwnProps, MergedProps>(
mappedDispatch = mapDispatchToProps(store.dispatch, props);
}
}
mappedDispatch = Object.assign({}, mappedDispatch, { dispatch: store.dispatch });
const mergedProps = (
mergeProps ||
((state, dispatch, originalProps) => {
@ -172,6 +176,13 @@ export function connect<StateProps, DispatchProps, OwnProps, MergedProps>(
return node;
};
if (options.forwardRef) {
const forwarded = forwardRef(function (props, ref) {
return Wrapper({ ...props, ref: ref });
});
return forwarded as WrappedComponent<OwnProps>;
}
return Wrapper;
};
}