Из App.js я объявляю «FollowingScreen», который состоит из модуля, который экспортирует «Following».
export const FollowingScreen = ({route, navigation}) => {
return (
<ScrollView style = {styles.scrollView}>
<View style = {{ flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: "#262423" }}>
<Following />
</View>
</ScrollView>
);
}
«Following» экспортируется файлом «following.js». Из «following.js» я хочу перейти к ProfileScreen:
import { useNavigation } from '@react-navigation/native';
class Following extends Component {
...
...
renderItem = ({item}, navigation) => (
<ListItem bottomDivider>
<ListItem.Content style = {{width: '100%', display: 'flex', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center'}}>
<ListItem.Title>{item.title}</ListItem.Title>
<TouchableOpacity
onPress = {() => navigation.navigate("ProfileScreen", {userInfo: {uri: item.probability, username: item.country_id, id_user: item.id_user}})}
style = {{ flexDirection: 'row'}}
>
<Image
style = {{ borderRadius: 50 }}
source = {{ uri: item.probability, width: 48, height: 48 }}
/>
</TouchableOpacity>
<TouchableOpacity
onPress = {() => navigation.navigate("ProfileScreen", {userInfo: {uri: item.probability, username: item.country_id, id_user: item.id_user}})}
style = {{ flexDirection: 'row'}}
>
<ListItem.Subtitle style = {{color: '#000'}}>
<Text style = {{fontFamily: 'Montserrat_600SemiBold' }}>{item.name} {item.surname}</Text>
{"\n"}
<Text style = {{fontFamily: 'Montserrat_600SemiBold' }}>@{item.country_id}</Text>
{"\n"}
{"\n"}
<Text style = {{fontFamily: 'Montserrat_600SemiBold' }}>{item.followers}</Text>
{"\n"}
<Text style = {{fontFamily: 'Montserrat_600SemiBold' }}>{item.total}</Text> Total
</ListItem.Subtitle>
</TouchableOpacity>
<Button
buttonStyle = {{backgroundColor: "#a6aba7", padding: 9, textAlign: "right", borderRadius: 10, display: item.isFollowing= = "Same user" ? "none" : "flex"}}
title = {item.isFollowing}
onPress = {() => {
if (item.isFollowing= = "Follow"){
this.follow(item.id_user);
}
else if (item.isFollowing= = "Unfollow"){
this.unfollow(item.id_user);
}
else if (item.isFollowing= = "Same user"){
//alert("Same user");
}
}}
/>
</ListItem.Content>
</ListItem>
);
}
к сожалению, я получаю «undefined не является объектом (оценка« navigation.navigate »)»
🤔 А знаете ли вы, что...
JavaScript - это скриптовый язык программирования, разработанный Netscape Communications Corporation.
Вам нужно объявить «навигацию» перед ее вызовом:
const navigation = useNavigation();
прямо перед
renderItem = (...)
Вы не передаете navigation
в качестве реквизита компоненту Following
, поэтому измените свой компонент FollowingScreen
аналогичным образом:
export const FollowingScreen = ({route, navigation}) => {
{/** Rest Of Code **/}
<Following navigation = {navigation}/>
{/** Rest of Code **/}
}
Затем в классе Following
используйте this.props.navigation.navigate(....)
.