无法在TabNavigator中切换选项卡（react-navigation）

Question

我正在使用react-navigation来构建嵌套的TabNavigator。

我的问题是在点击搜索按钮之前，我无法导航到其他标签。这太奇怪了。

（更新）我刚发现当我更改标签时，它会更改“关注”或“热门”标题。它不会渲染seconrd选项卡，“热门”，也不会切换选项卡。

这是第一个StackNavigator（附加到根目录）

export default StackNavigator ({
  Feedo: {
    screen: FeedMainTabNavigator,
    navigationOptions: {
      title: 'Title',
    },
  },
  Searcho: {
    screen: SearchScreen, // if I click second tab, it doesn't show the second tab. 
           //But then I navigate to SearchScreen and goback to FeedScreen, 
           //I can see the second tab was selected.
  }
}, {
    lazy: true
});

这是FeedMainTabNavigator

export default TabNavigator({
  UserFeed: {
    screen: UserFeedScreen
  },
  PopularPost: {
    screen: PopularPostScreen
  },
}, {
    tabBarOptions: {
      style: {
        backgroundColor: "#7E50CE",
        overflow: "hidden"
      },
      activeTintColor: "white",
      inactiveTintColor: "white",
      tabStyle: { width: 120 },
      indicatorStyle: { backgroundColor: 'white' }
    }
  }
);

这是UserFeedScreen（这里可能有问题吗？）

import {withRkTheme, RkText} from 'react-native-ui-kitten'
let ThemedNavigationBar = withRkTheme(NavBar);
import { FontAwesome } from '../../assets/icons'

class UserFeedScreen extends Component {
  static navigationOptions = ({navigation}) => ({
    title: 'Follow',
    headerRight: (
      <RkText
        rkType='awesome small'
        style={{color: 'white'}}
        onPress={() => {navigation.navigate('Searcho')}}>{FontAwesome.search}</RkText>
    ),
    header: (headerProps) => {
      return <ThemedNavigationBar navigation={navigation} headerProps={headerProps}/>
    },
  })

Answer 1

您需要重置，因为Searcho处于某个级别。试试这个

import { NavigationActions } from 'react-navigation';

用

替换onPress={() => {navigation.navigate('Searcho')}}

  onPress={() => {
    const resetAction = NavigationActions.reset({
      index: 0,
      actions: [
        NavigationActions.navigate({ routeName: 'Searcho'})
      ]
    });
    navigation.dispatch(resetAction);
  }}