구성 요소에 대한 응답 원시 형식 검사

Question

두 종류의 구성 요소를 처리 할 수있는 구성 요소가 있습니다. 하나는 텍스트 구성 요소이고 다른 하나는 이미지 구성 요소입니다.

두 구성 요소에 적용 할 수있는 기본 스타일이 있지만 텍스트 요소는 스타일에서 색상 키를 사용할 수 있지만 이미지에서는 tintColor 키 여야합니다 .

내가 가지고있는 요소를 확인할 수있는 방법이있어서 각 요소에 적절한 스타일을 설정할 수 있습니까? 내가 제대로 이해하면

Answer 1

, 당신은 3 개 스타일이처럼 처리 할 객체 사용할 수 있습니다 위의 코드 입력 오류가있을 수 있음을

const styles = StyleSheet.create({ 
    default: { marginTop: 10, borderWidth: 1 }, 
    onlyButton: { borderColor: '#F0F' }, 
    onlyText: { borderColor: '#C9F' }, 
}) 

<Text style={[styles.default, styles.onlyText]} /> 
<TouchableOpacity={[styles.default, styles.onlyButton]} /> 

주, 그것은 아이디어를 보여주기 위해 그냥 예입니다.

도움이되었거나 귀하의 질문에 오해 한 경우 알려주십시오.

는 당신은 많은 구성 요소가 몇 가지 공식 것을 포함, 같은 동작을 찾을 수 있습니다

Answer 2

을 도움이되기를 바랍니다.

예 : <ScrollView />style, contentContainerStyle, indicatorStyle.

구성 요소에 대한

때문일 수 있습니다 : 덮어 다음

<CompositeComponent 
    style={{backgroundColor: 'red'}} 
    textStyle={{color: 'black'}} 
    imageStyle={{tintColor: 'black'}} 
    /> 

하고 render() 기능에,

render() { 
    return (
    <View> 
     <Text style={{[this.props.style, this.props.textStyle]}} /> 
     <Image style={{[this.props.style, this.props.imageStyle]}} /> 
    </View> 
); 
} 

이 방법 <Text /> 및 <Image />주 같은 style, 각을 textStyle 또는 imageStyle로 .