Question

 <View style = {styles.container}>
           <TouchableOpacity style={styles.btn}
             onPress={() => this.props.navigation.navigate('AddCustomer') }>
             <Text style={styles.plus}>+</Text>
           </TouchableOpacity>
       </View>
     </List>

我想使用按一下功能打开一个组件，但是当我使用this.props.navigation.navigate（'AddCustomer'）时却没有任何反应？

您可以看一下我的代码（https://github.com/dakshbhardwaj/Swipe/blob/master/components/Customers.js）

我是React Native的新手。

你能帮我吗？

Answer 1

AddCustomer屏幕不是导航器的一部分。您创建了一个StackNavigator并将其添加到App组件中，但是您并未在应用程序中的任何地方使用该应用程序组件。

我不确定您要创建哪种导航，但是一种选择是创建如下所示的内容。将与客户相关的所有屏幕添加到StackNavigator，并将该导航器作为屏幕添加到TabNavigator。

export const CustomerStack = createStackNavigator(
  {
    Customers:{
      screen:Customers,
    },
    AddCustomer:{
      screen:AddCustomers
    }

  }
);

export default createBottomTabNavigator({
  Dashboard:{
    // ...
  },
  Customers:{
    screen: CustomerStack,
    navigationOptions:{
      tabBarLabel:'Customers',
      tabBarIcon:({tintColor}) => (
        <Icon name ="ios-people-outline" color =
          {tintColor} size = {24} />
      )
    }
  },
  Invoice:{
    // ...
  },
  TimeTracker:{
    // ...
  },
  More:{
    // ...
  }
},{
  tabBarOptions:{
    // ...
  }
})

PS：：在下一个问题上，请创建一个Minimal, Complete, and Verifiable example并将其添加到您的问题中。挖掘项目并尝试对其进行调试是一件很耗时的事情，这可能会导致您无法获得答案。

如何从功能中打开组件React Native

1 个答案: