React Native에서 제공하는 TouchableWithoutFeedback 을 한번 사용해 보시겠어요? 아래는 useRef를 사용하여 툴팁 요소에 대한 참조를 만들고, useEffect를 사용

React Native에서 제공하는 TouchableWithoutFeedback 을 한번 사용해 보시겠어요? 아래는 useRef를 사용하여 툴팁 요소에 대한 참조를 만들고, useEffect를 사용하여 툴팁 외부에서 클릭할 수 있는 글로벌 이벤트 리스너를 추가하는 예제입니다. Tooltip.js ```javascript import React, { useState, useRef, useEffect } from 'react'; import { View, Text, TouchableWithoutFeedback } from 'react-native'; const Tooltip = ({ children, tooltipText }) => { const [open, setOpen] = useState(false); const tooltipRef = useRef(null); useEffect(() => { const handleClickOutside = (event) => { if (tooltipRef.current && !tooltipRef.current.contains(event.target)) { setOpen(false); } }; document.addEventListener('mousedown', handleClickOutside); return () => { document.removeEventListener('mousedown', handleClickOutside); }; }, [tooltipRef]); return ( setOpen(!open)}> {children} {open && ( {tooltipText} )} ); }; export default Tooltip; ``` App.js ```javascript import { Text, View } from 'react-native'; import Tooltip from './Tooltip'; export default function App() { return ( Click the button to show tooltip Hover me to see the tooltip ); } ```