- tab bar를 TouchableOpacity로 만들어보자
const [activeSort, setActiveSort] = useState("Popular");
....
<View className="flex-row justify-around items-center mx-4 bg-neutral-100 rounded-full p-2 px-4 space-x-2">
{sortCategoryData.map((sort, index) => {
let isActive = sort == activeSort;
let activeButtonClass = isActive ? "bg-white shadow" : "";
return (
<TouchableOpacity
onPress={() => {
setActiveSort(sort);
}}
key={index}
className={`p-3 px-4 rounded-full flex ${activeButtonClass}`}
>
<Text className="font-bold">{sort}</Text>
</TouchableOpacity>
);
})}
</View>