React导航5.x上动态更改标题标题

Question

我最近更新了我的项目以响应导航5.x。在早期版本中，我们过去将标题设置如下：

static navigationOptions = ({ navigation }) => ({
        title: 'find',
});

这在React Navigation 5.x上不起作用。请提出建议。

Answer 1

嘿，您应该明确检查一下：https://reactnavigation.org/docs/screen-options-resolution/

这里您将看到如何为每个选项卡和每个堆栈设置标题。阅读并扔掉页面，看看这个功能：

function getHeaderTitle(route) {
  // Access the tab navigator's state using `route.state`
  const routeName = route.state
    ? // Get the currently active route name in the tab navigator
      route.state.routes[route.state.index].name
    : // If state doesn't exist, we need to default to `screen` param if available, or the initial screen
      // In our case, it's "Feed" as that's the first screen inside the navigator
      route.params?.screen || 'Feed';

  switch (routeName) {
    case 'Feed':
      return 'News feed';
    case 'Profile':
      return 'My profile';
    case 'Account':
      return 'My account';
  }
}