React-Native 将标题从 Navigator 传递到 NavigatorIOS

Question

我一直在寻找这个问题的解决方案已经有一段时间了，但找不到任何可以解决它的方法。

这是我想要完成的事情。 我正在创建一个带有登录屏幕的应用程序。登录屏幕不能有导航栏，但必须在登录后导航到带有导航栏的组件，该导航栏具有从登录组件（用户名）传递的自定义标题。

当应用加载时，App 组件将与标准的 react Navigator 组件一起加载，该组件依次渲染 Login 组件。当 Login 组件渲染时，它会检查之前的会话，并使用 NavigatorIOS 组件渲染主应用程序（Wrapper 组件），NavigatorIOS 组件又渲染另一个组件（List 组件，下面的代码中未显示）。

有可能吗？如果是这样，如何:)

我有以下代码：

// The first main component,
// this will be loaded from the AppRegistry
var App = React.createClass({
    render() {
        return (
            <Navigator
                initialRoute={{
                    component: Login
                }}
                renderScene={(route, navigator) => {
                    return React.createElement(route.component, { navigator });         
                }} />
        )
    }
});

// The login component that
// renders and handles all login processes.
var Login = React.createClass({
    componentDidMount() {
        // ... login logic ...
        this.props.navigator.replace({
            component: Wrapper,
            // I want to pass a title here
        });
    },

    render() {
        return (
            <Text>Login page</Text>
        )
    }
});

// When logged in, the NavigatorIOS component will be
// shown, here is where I want to title previously passed
// from the login component.
var Wrapper = React.createClass({
    render() {
        return (
            <NavigatorIOS
                initialRoute={{
                    component: List
                    title: // I want to fetch the title here
                }} />
        )
    }
});

Answer 1

var Login = React.createClass({
    componentDidMount() {
        // ... login logic ...
        this.props.navigator.replace({
            component: Wrapper,
            componentConfig : {
                title : "My New Title"
            }
            // I want to pass a title here
        });
    },

    render() {
        return (
            <Text>Login page</Text>
        )
    }
});

// When logged in, the NavigatorIOS component will be
// shown, here is where I want to title previously passed
// from the login component.
var Wrapper = React.createClass({
    render() {
        return (
            <NavigatorIOS
                initialRoute={{
                    component: List
                    title: this.props.title
                }} />
        )
    }
});