Render Error

Par imran99, il y a 2 ans

Javascript React

je besoin d'aide

import { View, Text, SafeAreaView, StyleSheet, TouchableOpacity, Image} from 'react-native' import React, { useRef } from 'react' import Colors from '@/constants/Colors'; import { Feather } from '@expo/vector-icons'; import { Ionicons } from '@expo/vector-icons'; import BottomSheet from './BottomSheet'; import { BottomSheetModal } from '@gorhom/bottom-sheet'; const CustomHeader = () => { const bottomSheetRef = useRef<BottomSheetModal>(null); const openModal=() =>{ bottomSheetRef.current?.present(); }; return ( <SafeAreaView style={styles.safeArea}> <BottomSheet ref={bottomSheetRef}/> <View style={styles.container}> <TouchableOpacity onPress={openModal}> <Image style={styles.bike}source={require('@/assets/images/bike.png')}/> </TouchableOpacity> <TouchableOpacity style={styles.titleContainer} onPress={openModal}> <Text style={styles.title}>Delivery . Now</Text> <View style={styles.locationName}> <Text style={styles.subtitle}>Selected Location</Text> <Ionicons name="chevron-down-outline" size={20} color={Colors.primary} /> </View> </TouchableOpacity> <TouchableOpacity style={styles.profileButton}> <Feather name="search" size={20} color={Colors.primary} /> </TouchableOpacity> </View> </SafeAreaView > ); }; const styles = StyleSheet.create ({ safeArea:{ flex: 1, backgroundColor: '#fff', }, container:{ height: 60, backgroundColor: '#fff', flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between', paddingHorizontal: 20, gap: 20, }, bike:{ width: 30, height: 30, }, titleContainer:{ flex: 1, }, title:{ fontSize: 14, color: Colors.grey2, }, profileButton:{ backgroundColor: Colors.lightGrey, padding: 10, borderRadius: 50, }, subtitle:{ fontSize: 17, fontWeight: 'bold' }, locationName:{ flexDirection: 'row' }, }); export default CustomHeader;

Ce que j'obtiens

PanGesturreHandler must be used as a descendant of GestureHandlerRootView. Otherwise the gestures will not be recognized

Aucune réponse