Skip to content

Feat use page wrapper comp#1924

Merged
hiyuki merged 20 commits intomasterfrom
feat-use-page-wrapper-comp
Apr 9, 2025
Merged

Feat use page wrapper comp#1924
hiyuki merged 20 commits intomasterfrom
feat-use-page-wrapper-comp

Conversation

@Blackgan3
Copy link
Collaborator

  • 抽离公共PageWrapper组件,提供给独立组件输出使用
  • global navigationHelper改为运行时注入

import { IntersectionObserverContext, RouteContext, KeyboardAvoidContext } from '@mpxjs/webpack-plugin/lib/runtime/components/react/dist/context'
import KeyboardAvoidingView from '@mpxjs/webpack-plugin/lib/runtime/components/react/dist/KeyboardAvoidingView'
import { IntersectionObserverContext, RouteContext } from '@mpxjs/webpack-plugin/lib/runtime/components/react/dist/context'
import PageWrapper from './pageWrapper'
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

不用迁移出去,就留在当前模块内作为一个named export就可以


if (type === 'page') {
const { PortalHost, useSafeAreaInsets, GestureHandlerRootView, useHeaderHeight } = global.__navigationHelper
const pageConfig = Object.assign({}, global.__mpxPageConfig, currentInject.pageConfig)
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

global.__mpxPageConfig的合入放在pageWrapper中

return ({ navigation, route }) => createElement(
PageWrapper, {
pageConfig,
pageStatusMap,
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

不需要传递

pageId: currentPageId
})

if (navigation) {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

不要在hooks前面加条件判断

createElement(PortalHost,
null,
// 组件单独使用时传递children可能为 element 元素
isValidElement(children)
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

把pageWrapper设计为一个高阶组件

import { SafeAreaProvider, useSafeAreaInsets } from 'react-native-safe-area-context'
import { GestureHandlerRootView } from 'react-native-gesture-handler'

export {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

放到env/navigationHelper.ios/android.js里去吧

))
}
}

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

const pageWrapper = (component)=>{
return (props)=>{
createElement(component, {...props, navigation, route,id})
}
}

const page = (props)=>{
return ...
}

const page2 =pageWrapper(page)

// todo custom portal host for active route
}
return Page
currentInjectPageConfig = currentInject.pageConfig
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

不应该走闭包传递,应该走props传递

const currentPageConfig = Object.assign({}, global.__mpxPageConfig, currentInjectPageConfig, pageConfig)
if (!navigation || !route) {
// 独立组件使用时要求传递navigation
error('Using pageWrapper requires passing navigation and route')
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

传递error对象,以及可以直接return

@hiyuki hiyuki merged commit eafbb3f into master Apr 9, 2025
6 checks passed
@hiyuki hiyuki deleted the feat-use-page-wrapper-comp branch April 9, 2025 11:12
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants