Question

我已经有很长一段时间没遇到这个问题了，我找不到解决问题的答案。
Here is an actual screenshot of what is happening.

问题是：

1.新闻源屏幕上默认返回按钮
2.双头
3.导航到任何全局屏幕时，TabBar消失

代码本身：

routes.js

const RecordScreen = StackNavigator({
  Main:   { screen: Record },
  Choose: { screen: RecordChoose },
  Add:    { screen: RecordAdd }
})

const NewsfeedScreen = StackNavigator({
  Main:    { screen: Newsfeed },
  Details: { screen: NewsfeedDetails }
})

export const FriendsScreen = StackNavigator({
  Main: { screen: Friends },
  List: { screen: FriendList }
})

const Tabs = TabNavigator({
  Record:   { screen: RecordScreen },
  Newsfeed: { screen: NewsfeedScreen },
  Friends:  { screen: FriendsScreen }
})

// is it correct to nest TabNavigator with StackNavigator like this?
export const LoggedIn = StackNavigator({
  Main: { screen: Tabs },

  // global Screens
  Gallery:  { screen: Gallery },
  Profile:  { screen: Profile  },
  Settings: { screen: Settings }
})

export const LoggedOut = StackNavigator({
  Welcome: { screen: Welcome },
  SignIn:  { screen: SignIn },
  SignUp:  { screen: SignUp }
})

index.js

import React, { Component } from 'react'
import { LoggedIn, LoggedOut } from '@routes'

class Main extends Component {

  // of course is not exactly like this,
  // just an example
  state = {
    loggedIn: true
  }

  render() {
    return this.state.loggedIn
      ? <LoggedIn />
      : <LoggedOut />
  }
}

任何帮助表示赞赏！谢谢。

Answer 1

以下更改会让事情变得更好吗？

从：

export const LoggedIn = StackNavigator({
  Main: { screen: Tabs },

  // global Screens
  Gallery:  { screen: Gallery },
  Profile:  { screen: Profile  },
  Settings: { screen: Settings }
})

到

const doNotShowHeaderOption = {
  navigationOptions: {
    header: null,
  },
};
export const LoggedIn = StackNavigator({
  Main: { screen: Tabs, ...doNotShowHeaderOption, },

  // global Screens
  Gallery:  { screen: Gallery },
  Profile:  { screen: Profile  },
  Settings: { screen: Settings }
})

双头和双安装主屏幕 - 反应导航

1 个答案: