diff --git a/docs-vitepress/guide/platform/rn.md b/docs-vitepress/guide/platform/rn.md index 12add29d8f..7ad61ae65c 100644 --- a/docs-vitepress/guide/platform/rn.md +++ b/docs-vitepress/guide/platform/rn.md @@ -315,10 +315,10 @@ env() 函数通过和 var() 函数类似形式, 区别在于:一是环境变 ### 使用RN组件 在Mpx组件内引用RN组件,采用如下方式 - **RN组件注册方式**:需在components属性下进行引用注册。 -- **RN组件的属性与事件**:属性与事件参考RN原生支持的属性与事件名,对应赋值方式按照Mpx语法进行双括号包裹,组件使用的值需要通过 REACTHOOKSEXEC方法的返回值的方式进行声明。 +- **RN组件的属性与事件**:属性与事件参考RN原生支持的属性与事件名,对应赋值方式按照Mpx语法进行双括号包裹,组件使用的值需要通过 onReactHooksExec 的返回值的方式进行声明。 - **RN组件的样式定义**: 组件支持样式属性的透传,通过在RN组件上定义style即可透传样式 - **其他功能**: 支持在RN组件内使用slot -```javascript +```html + +``` + +在选项式api中,使用 REACTHOOKSEXEC 替代 onReactHooksExec,例如 +```html + ``` + + + ### 使用React hooks Mpx提供了hooks的执行机制,通过在Mpx组件内注册REACTHOOKSEXEC方法,保障RN组件的初始化执行。hooks的返回值支持数据与方法 - 模板上RN组件/Mpx组件的数据渲染 diff --git a/packages/core/@types/global.d.ts b/packages/core/@types/global.d.ts index 62977129aa..765512e368 100644 --- a/packages/core/@types/global.d.ts +++ b/packages/core/@types/global.d.ts @@ -11,3 +11,6 @@ declare module '*?resolve' { const resourcePath: string export default resourcePath } + +declare let setAppShow: () => void +declare let setAppHide: () => void diff --git a/packages/core/@types/index.d.ts b/packages/core/@types/index.d.ts index e16b8cf00e..ca525742dd 100644 --- a/packages/core/@types/index.d.ts +++ b/packages/core/@types/index.d.ts @@ -9,6 +9,7 @@ import type { GetComputedType } from '@mpxjs/store' import type { ScaledSize } from 'react-native' +import type { ComponentType } from 'react' export * from '@mpxjs/store' // utils @@ -126,9 +127,17 @@ interface Context { type ExtendedComponentOptions = { disconnectOnUnmounted?: boolean shallowReactivePattern?: RegExp + /** + * 是否禁用render函数的useMemo,仅输出RN支持 + */ + disableMemo?: boolean } & WechatMiniprogram.Component.ComponentOptions interface ComponentOpt, S extends Record> extends Partial { + /** + * ReactNative 原生组件注册 + */ + components?: Record, data?: D properties?: P computed?: C @@ -221,7 +230,7 @@ type WxComponentIns, 'selectComponent' | 'selectAllComponents'> & ReplaceWxComponentIns -type ComponentIns = [], S extends Record = {}, O = {}> = +export type ComponentIns = [], S extends Record = {}, O = {}> = GetDataType & UnboxMixinsField & M & UnboxMixinsField & { [K in keyof S]: S[K] extends Ref ? V : S[K] } & GetPropsType

> & @@ -296,7 +305,7 @@ export interface RnConfig { * - `true`:允许退出应用 * - `false`:阻止退出应用 */ - onAppBack?: () => boolean + onAppBack?: (delta: number) => boolean /** * 是否禁用框架内部的 AppStateChange 监听。 @@ -356,26 +365,6 @@ export interface RnConfig { dimensions: T ) => T | void - /** - * 异步分包加载配置。 - */ - asyncChunk?: { - /** - * 加载超时时长配置,单位为毫秒。 - */ - timeout: number - - /** - * 异步分包页面加载超时或失败时,自定义兜底页面文件路径。 - */ - fallback: string - - /** - * 异步分包页面加载时,自定义 loading 页面文件路径。 - */ - loading: string - } - /** * 加载并执行异步分包的方法。 * @@ -399,10 +388,10 @@ interface MpxConfig { ignoreWarning: boolean | string | RegExp | ((msg: string, location: string, e: Error) => boolean) ignoreProxyWhiteList: Array observeClassInstance: boolean | Array - errorHandler: (msg: String, location: String, e: Error) => any | null - warnHandler: (msg: String, location: String, e: Error) => any | null - proxyEventHandler: (e: WechatMiniprogram.CustomEvent, target: ComponentIns<{}, {}, {}, {}, []>) => any | null - setDataHandler: (data: object, target: ComponentIns<{}, {}, {}, {}, []>) => any | null + errorHandler: (msg: String, location: String, e: Error) => void + warnHandler: (msg: String, location: String, e: Error) => void + proxyEventHandler: (e: WechatMiniprogram.CustomEvent, target: ComponentIns<{}, {}, {}, {}, []>) => void + setDataHandler: (data: object, target: ComponentIns<{}, {}, {}, {}, []>) => void forceFlushSync: boolean, webRouteConfig: object, webConfig: object, @@ -413,7 +402,7 @@ interface MpxConfig { */ webviewConfig: WebviewConfig, /** react-native 相关配置,用于挂载事件等,如 onShareAppMessage */ - rnConfig?: RnConfig, + rnConfig: RnConfig, } type SupportedMode = 'wx' | 'ali' | 'qq' | 'swan' | 'tt' | 'web' | 'qa' diff --git a/packages/core/package.json b/packages/core/package.json index a308d87931..8e6434788a 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -93,6 +93,10 @@ "optional": true } }, + "devDependencies": { + "@types/react": "^18.2.79", + "react-native": "^0.74.5" + }, "publishConfig": { "registry": "https://registry.npmjs.org", "access": "public" diff --git a/packages/store/@types/index.d.ts b/packages/store/@types/index.d.ts index 2699b43e26..dcf0f1cdcf 100644 --- a/packages/store/@types/index.d.ts +++ b/packages/store/@types/index.d.ts @@ -4,7 +4,7 @@ type UnboxDepField = F extends keyof D ? D[F] : {} type GetReturnOrSelf = T extends (...args: any)=> infer R ? R : T -interface compContext { +export interface compContext { [key: string]: any } @@ -158,7 +158,7 @@ type UnionToIntersection = (U extends any ? I : never; -interface mapStateFunctionType { +export interface mapStateFunctionType { [key: string]: (state: S, getter: G) => any } interface DeeperMutationsAndActions { @@ -242,7 +242,7 @@ interface StoreOptWithThis { modules?: Record> } -interface IStoreWithThis { +export interface IStoreWithThis { [DEPS_SYMBOL]: D [STATE_SYMBOL]: S @@ -384,7 +384,7 @@ interface IStoreWithThis { mapActionsToInstance(obj: T, context: compContext): void } -type StoreWithThis = IStoreWithThis & CompatibleDispatch +export type StoreWithThis = IStoreWithThis & CompatibleDispatch interface StoreOpt { state?: S,