namespaced JS 가져 오기 확장

Question

이것은 일반적인 ES6 질문이지만 React Native의 컨텍스트에서 발생했습니다. 기본적인 문제는 내가 보통 'react-native'모듈에서 내 구성 요소로 가져 오는 일부 구성 요소를 무시하고 싶다는 것입니다. 이 작업을 수행하는 내 방법은 다음과 같습니다 :

---

대신 import { Text, View, etc } from 'react-native'

와 구성 요소를 필요로하는이처럼이 필요합니다

export * from 'react-native'

: import { Text, View, etc } from './ui_components'

ui_components.js 같은 것을 찾는 위치

---

문제점 :이 내보내기에 내 구성 요소를 추가하려면 어떻게합니까? 이상적으로는 다음과 같이 뭔가를 수행하여 ui_components.js에 추가 할 수있을 것입니다 :

import * as RN from 'react-native' 
RN.Text = myTextComponent 
RN.View = myViewComponent 
export * from RN 

을하지만이 잘 작동을하지 않습니다. 어떤 아이디어?

Answer 1

React Native의 구성 요소를 가져 와서 확장 프로그램의 유무에 관계없이 다시 가져와야합니다. 이는 귀하에게 달려 있습니다.

그러나 기억하십시오 - React의 내부 (또는 다른 내부)를 무시하지 마십시오. 구성 요소는 구성 가능합니다.

예를 들어 여기에서 내 앱 Text 구성 요소를 만듭니다. 왜냐하면 내 앱의 모든 텍스트가 기본적으로 빨간색으로 표시되기를 원합니다. 또한 제목/부제/다른 색상이 필요한 경우 구성 할 수 싶습니다.

import React from 'react'; 
import { Text as NativeText } from 'react-native'; 

export default function Text({ style, ...props}) { 
    return <NativeText style={[ { color: 'red' }, style]} {...props} /> 
} 

아이디어가 있습니까? 좋은

, 지금 구조 폴더로 ...

ui_components 
| - index.js 
| - Text.js 

// Text.js 
// See example above... 

// index.js 
export { default as Text } from './Text'; 

// In your app 
import { Text } from './ui_components';