本文整理匯總了TypeScript中react-redux.connect函數的典型用法代碼示例。如果您正苦於以下問題：TypeScript connect函數的具體用法？TypeScript connect怎麽用？TypeScript connect使用的例子？那麽, 這裏精選的函數代碼示例或許可以為您提供幫助。
在下文中一共展示了connect函數的10個代碼示例，這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚，您的評價將有助於係統推薦出更棒的TypeScript代碼示例。
示例1: factory
function factory(
showModal: (s: State) => boolean,
closeActionEmitter: () => Action,
applyActionEmitter: () => Action
) {
function mapStateToProps(state: State): PendingChangesModalComponent.Props {
return {
show: showModal(state)
};
}
return connect(
mapStateToProps,
{
onHide: () => closeActionEmitter(),
onContinueAndDiscard: () => batch(
applyActionEmitter(),
closeActionEmitter()
),
onContinueAndSave: () => batch(
saveCurrentCartride(),
applyActionEmitter(),
closeActionEmitter()
)
}
)(PendingChangesModalComponent);
}示例2: connect
export default <TInner extends {}, TOutter extends {}>(
mapEventsToProps: (ownProps: TOutter, eventsData: Linode.Event[]) => TInner,
) => connect((state: ApplicationState, ownProps: TOutter) => {
const eventsData = state.events.events;
return mapEventsToProps(ownProps, eventsData);
});示例3: connect
) => <TUIState, TMappedProps = Props<TUIState>>(
id: string,
mapProps?: MapCreateUIStateProps<TUIState, TMappedProps>,
) => connect(
(state: TAppState, props: UIStateComponentProps<TMappedProps>) => ({
uiState: uiStateSelector(
state, Object.assign({ uiStateId: id, uiStateBranchSelector }, props)
) as TUIState,
}),
(dispatch) => ({
setUIState: setUIStateSelector<TUIState, UIStateIdProps<{}>>(dispatch, { uiStateId: id }),
}),
// Using Object.assign here to avoid "Spread types may only be created from object types"
// https://github.com/Microsoft/TypeScript/issues/10727
(stateProps, dispatchProps, ownProps) => Object.assign(
{},
ownProps,
mapProps
? mapProps({...stateProps, ...dispatchProps})
: {...stateProps, ...dispatchProps}
)
)((props) => {
// Until TypeScript allows spread on interfaces, force props to any to allow ES7 rest syntax
// https://github.com/Microsoft/TypeScript/issues/16780
// tslint:disable-next-line:no-any
const { children, ...rest } = props as any;
return children(rest);
});示例4: connect
export default <TInner extends {}, TOutter extends {}>(
mapAccountToProps: (ownProps: TOutter, account?: Linode.Profile) => TInner
) =>
connect((state: ApplicationState, ownProps: TOutter) => {
const profile = state.__resources.profile.data;
return mapAccountToProps(ownProps, profile);
});示例5: connect
export default <TInner extends {}, TOutter extends {}>(
mapToProps: MapProps<TOutter, TInner>
) =>
connect((state: ApplicationState, ownProps: TOutter) => {
const { loading, error, entities } = state.__resources.linodes;
return mapToProps(ownProps, entities, loading, error);
});示例6: connect
export const withNotifications = (
mapState: (s: State) => any = defaultMapState,
mapDispatch: (actions: Actions) => any = defaultMapDispatch
) =>
connect(
(state: ApplicationState) => mapState(state.__resources.notifications),
mapDispatch(actions)
);示例7: connect
export default <TInner extends {}, TOutter extends {}>(
mapImagesToProps: (ownProps: TOutter, images: Linode.Image[], imagesLoading: boolean, imageError?: string ) => TInner,
) => connect((state: ApplicationState, ownProps: TOutter) => {
const images = state.__resources.images.entities;
const imagesLoading = state.__resources.images.loading;
const { error } = state.__resources.images;
const imageError = isEmpty(error) ? error![0].reason : undefined; // @todo use updated error handling utils after they're merged
return mapImagesToProps(ownProps, images, imagesLoading, imageError);
});示例8: dispatch
export default <AppState, Data>({
namespace,
contentTypes,
}: {
namespace: string
contentTypes: Array<IContentType<Data>>
}) => {
const actions = actionsFactory<Data>(namespace)
const mapStateToProps = ({
panes
}: AppState & {
panes: IPanesState<Data>
}) => {
const entry = panes[namespace]
return {
namespace,
root: entry === undefined ? undefined : entry.panes.find(pane => pane.childOf === undefined),
panes: entry === undefined ? [] : entry.panes,
contentTypes
}
}
const mapDispatchToProps = (dispatch: Dispatch) => ({
init: () => {
dispatch(actions.initPanesNamespace())
},
setCurrentPane: (paneId: string) => {
dispatch(actions.setCurrentPane(paneId))
},
addContentToCurrentPane: (content: IPaneContent<Data>) => {
dispatch(actions.addContentToCurrentPane(content))
},
setPaneCurrentContent: (paneId: string, contentId: string) => {
dispatch(actions.setPaneCurrentContent(paneId, contentId))
},
removePaneContent: (paneId: string, contentId: string) => {
dispatch(actions.removePaneContent(paneId, contentId))
},
removeContentFromAllPanes: (contentId: string) => {
dispatch(actions.removeContentFromAllPanes(contentId))
},
splitPane: (paneId: string, axis: PaneSplitAxis) => {
dispatch(actions.splitPane(paneId, axis))
},
})
class NameSpacedPaneManager extends PaneManager<Data> {}
return connect(
mapStateToProps,
mapDispatchToProps
)(NameSpacedPaneManager)
}示例9: connect
export default <TInner extends {}, TOutter extends {}>(
mapVolumesToProps: (ownProps: TOutter, volumesData: VolumesData, volumesLoading: boolean, volumesError?: Error ) => TInner,
) => connect((state: ApplicationState, ownProps: TOutter) => {
const { items, itemsById } = state.__resources.volumes;
const volumesData = { items, itemsById };
const volumesLoading = state.__resources.volumes.loading;
const volumesError = state.__resources.volumes.error;
return mapVolumesToProps(ownProps, volumesData, volumesLoading, volumesError);
});示例10: mapSelectors
}: Config = {}) => (
mapStateToProps,
mapActionsToProps?: any
) => {
const makeMapStateToProps = () => mapSelectors(selectors, mapStateToProps)
let connectState = connect(makeMapStateToProps)
if (mapActionsToProps) {
const mapDispatchToProps = (dispatch: Dispatch<State>, ownProps: OP) => (
mapActions(actions, mapActionsToProps, { dispatch, ownProps })
)
connectState = connect(makeMapStateToProps, mapDispatchToProps)
}
return compose(
connectState,
stateHOC
)
}