如何用ScreenProps导出StackNavigator

Question

我正在尝试导出stacknavigator，以使子屏幕可以具有某些屏幕属性。我尝试了这样的事情：

//Router.js
import React, { Component } from 'react';
import {StackNavigator} from 'react-navigation';
import { AppRegistry } from 'react-native';
import Home from './Home';
let Router = 
{
  Home: {screen: Home, screenProps:"hello"},
}
const Navigator = StackNavigator(Router);
export default Navigator;

然后我有

//Home.js
import React, { Component } from 'react';
/* define navOptions */
export default class Home extends Component {
  static navigationOptions = navOptions;
  componentDidMount()
  {
    const db = new DB(this);
    db.open();
  };
    constructor(props)
    {
        super(props);
    }
render ()
{
console.log(this.props);
}
}

但是this.props.screenProps是空的。

然后我尝试这样做

//Router.js
import React, { Component } from 'react';
import {StackNavigator} from 'react-navigation';
import { AppRegistry } from 'react-native';
import Home from './Home';
let Router = 
{
  Home: {screen: Home, screenProps:"hello"},
}
const Navigator = StackNavigator(Router);
const nav = <Navigator screenProps="hello" />
export default nav;

但这引起了此错误

元素类型无效：预期一个字符串（用于内置组件） 或类/功能（用于复合组件），但获取：对象。

那么，如何将自定义屏幕属性从路由器文件传递到主屏幕？

Answer 1

错误说ScreenProps期望对象，而不是字符串。因此，ScreenProps应该看起来像这样

let Router = 
{
    Home: {screen: Home, screenProps: {name: "hello"}}
}

如果"名称"是您要分配" Hello"的属性。这至少是使用Tabnavigator进行的。

在stacknavigator中，您不会通过ScreenProps，而是根据如何将参数传递到StackNavigator中的屏幕？这就是路由器的外观

let Router = 
{
    Home: {screen: Home, {name: "hello"}}
}

您可以使用this.props.navigation.state.params.name