无法从反应导航中找到参数

时间:2017-07-22 20:45:27

标签: react-native react-navigation

我有一个非常令人困惑的问题。我使用react-navigation导航我的react-native应用程序。

navigate('Story', { id: story.id })

此代码有效,并为我提供了一个可以在StoryScreen上使用的ID

navigate('User', { id: user.id })

但是这段代码并没有给我一个我可以在我的用户屏幕上使用的ID,我已经测试了发送一个整数但它没有注册。

代码链接:https://github.com/yarism/StoryWarsApp/blob/master/app/screens/navigation/NavigationScreen.js

UserScreen:

import React from 'react';
import {
    AppRegistry,
    Text,
    View,
    ScrollView,
    Image,
    StyleSheet
} from 'react-native';

export default class UserScreen extends React.Component {

    constructor(props) {
        super(props);
    }

    componentWillMount() {
        this.setState({ isLoading: true });
        this.fetchUser();
    }

    fetchUser() {
        fetch('https://www.storywars.net/api/users/' + this.props.navigation.state.params.id)

this.props.navigation.state.params.id未定义

1 个答案:

答案 0 :(得分:1)

在检出您的回购后,我认为错误与UserScreen中TabNav中的App.js错误有关。

默认情况下,Tabviews最初一起加载。此时,该州没有params.id。解决此问题的一种方法是以某种方式为用户ID设置默认值。目前无法为场景设置默认参数,但您可以使用screenProps从导航器中传递内容。 e.g。

const Navigator = TabNavigator({...});
return <Navigator screenProps={{ userId: 2, ...this.props.screenProps }} />

然后找到区分“个人资料”页面与常规用户屏幕的方法,使用this.props.screenProps.userId来获取个人资料页面。