본문 바로가기

FrameWork/ReactNative

[ReactNative] <Text/> ‘onPress’ 이벤트에 따른 기본 Gray background 없애기

React Native의 <Text> 컴포넌트에서 발생하는 onPress 이벤트에 따른 기본 gray background를 없애려면 <Text> 컴포넌트에<TouchableWithoutFeedback/> 컴포넌트를 사용하여 감싸야 한다. 이를 통해 onPress 이벤트에 대한 기본 터치 피드백이 제거된다.

[ 수정전 ]

<Text
    onPress={() => {setSelectedDate(date.dateString);}}
  style={[tw`border-red-900 h-full`]}
>
  {date.day}
</Text>

[ 수정후 ]

<TouchableWithoutFeedback
  onPress={() => {
    setSelectedDate(date.dateString);
  }}
>
    <Text style={[tw`border-red-900 h-full`]}>
      {date.day}
    </Text>
</TouchableWithoutFeedback>