Как получить доступ к реквизиту с любого экрана, используя реагировать 5? - PullRequest
0 голосов
/ 27 февраля 2020

Я хочу задать вопрос. Я новичок в реакции и не знаю, как использовать useNavigation на компоненте реакции. Как получить доступ к реквизитам в Navigation на третьем экране, чтобы он мог go к деталям каналов (экран 4), особенно с помощью реагирования навигации 5.

Приложение. js

<NavigationContainer>
  <Drawer.Navigator>
    <Drawer.Screen name="Home" component={HomeScreen} />
    <Drawer.Screen name="Berita" component={BeritaScreen} />
    <Drawer.Screen name="Tournament" component={TournamentScreen} />
  </Drawer.Navigator>
</NavigationContainer>

Home. js

....
<View style={{height:1,backgroundColor:'#eee',marginTop:20,marginBottom:10}}></View>
        <View style={{ flexDirection: 'row', width: 100 }}>
            <Text style={{ width: 160, textTransform: 'uppercase', fontFamily: 'montserrat_bold', letterSpacing: -1, margin: 15, fontSize: 17 }}>Berita Pilihan</Text>
            <View style={{ width: 240, margin: 20, marginLeft: -30, justifyContent: 'center' }}>
              <Image source={require('../assets/icon/stripes.png')} style={{ flex: 1, width: '100%' }} imageStyle={{ resizeMode: 'repeat' }} />
            </View>
          </View>
        <Feeds />
      </Content>
      </Container>

Feeds. js

renderRow = ({ item }) => {
    return (
        this.state.isLoading
        ?
        <View style={{flex:1, alignItem:'center',justifyContent:'center'}}>
            <ActivityIndicator size="Large" color="#222" animating/>
        </View>
        :
        <List style={{}}>
            <ListItem 
            onPress={() =>  this.props.navigation.navigate('DetailScreen')}
            thumbnail thumbnail style={{ marginTop:5,marginBottom: 5, height: 90 }}>
                <Left style={{ width: 100 }}>
                    <Thumbnail style={{ flex: 1, borderRadius: 4, width: '100%', height: 80 }} square source={{ uri: item._embedded['wp:featuredmedia'][0].media_details.sizes.medium.source_url }} />
                </Left>
                <Body style={{}}>
                    <Text style={{ fontSize: 12 }}>{item._embedded['wp:term'][0][0].name}</Text>
                    <Text style={{ fontSize:15, fontFamily: "montserrat_bold", letterSpacing: -.5 }} >{item.title.rendered} </Text>
                    <Text style={{fontSize:11,marginTop:5}}>{item._embedded.author[0].name}</Text>
                </Body>
            </ListItem>
        </List>
    );
}

render() {

    let { dataSource, isLoading } = this.state
    return (

        <>
        <FlatList
            data={this.state.dataSource}
            refreshing={this.state.isLoading}
            onRefresh={this.fetchData}
            keyExtractor={(item, index) => index.toString()}
            renderItem={this.renderRow}
        />
        </>

Заранее спасибо

1 Ответ

0 голосов
/ 27 февраля 2020

проходные реквизиты

this.props.navigation.navigate('Details', {
            itemId: 86,
            otherParam: 'anything you want here',
          });

доступ к реквизитам на следующем экране

const { itemId,otherParam } = this.props.route.params;
console.log(itemId);
console.log(otherParam);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...