래퍼를 추가하여 네이티브 스타일의 타사 구성요소에 반응

Question

내 질문:

react-native-popup-menu에서 제공하는 컴포넌트에 나만의 스타일을 추가해서 컴포넌트 라이브러리에 추가하려고 합니다. 이들은 다음과 같은 예상 계층 구조를 가진 Menu, MenuOptions 및 MenuOption 구성 요소를 제공합니다.

으아악

각 요소에 대한 래퍼를 만들고, 그 안에 있는 구성 요소의 스타일을 지정하고, 누군가 구성 요소 라이브러리에서 해당 구성 요소를 가져올 때 래퍼를 반환할 계획입니다.

예를 들어 메뉴 구성 요소의 래퍼는 다음과 같습니다.

으아악

이렇게 하면 각 레이어에 래퍼(추가 요소)가 추가되어 다음과 같은 계층 구조가 생성됩니다.

으아악

패키지는 메뉴를 올바르게 표시하기 위해 계층 구조에 의존하기 때문에 이것을 좋아하지 않습니다. "MenuOptions는 Menu의 하위 항목이어야 합니다." 오류 발생

사용자 정의 스타일 메뉴를 만들어 구성 요소 라이브러리에 구성 요소로 노출할 수 있는 방법이 있나요? 반응이라면 CSS 클래스를 다시 작성하겠지만 반응 네이티브에는 계단식 효과가 없습니다.

어떤 단서도 매우 도움이 될 것입니다. 감사해요.

Answer 1

문제가 정확히 무엇인지 잘 모르겠습니다. 따라서 여기에 도움이 될 수 있는 몇 가지 팁/단서를 추가하겠습니다.

문서 보기 https://github.com/instea/react-native-popup-menu/blob/master/doc/extensions.md 및 해당 예제

여기에서 다음을 수행/사용할 수 있습니다.

1. MenuOptions 스타일은 아무런 문제 없이 기본적으로 지원됩니다

으아아아

2. 옵션 컨테이너의 커스텀 스타일링도 가능할 것 같습니다

<菜单渲染器={RoundedContextMenu}>

약간의 상용구만 있으면 됩니다(예제 참조). 이것을 사용자 정의 구성 요소로 래핑하는 것은 문제가 되지 않을 것 같습니다

3. 모든 "왼쪽" 스타일은 모든 어린이를 수용하는 트리거입니다...이것이 이제 여러분의 구성 요소에 쉽게 래핑될 수 있는지 확실하지 않습니다...