React native - 如何实现两个值之间的切换并根据所选值显示不同的视图

Question

在我的 React Native 应用程序中，我需要显示 Youtube 风格的收件箱屏幕： 顶部的开关有两个值。根据在开关中选择的值，预期的行为是为每个值显示不同的视图和内容。预期的行为也是能够左右滑动以显示这两个不同的视图。开关应根据以下视图的滑动更改其状态：向左或向右。

现在，我正在尝试使用两个不同的 touchableHighlight 作为我的开关，但确信这不是正确的方法。 是否有适合此用例的特定 React Native 组件？

<View style = {styles.ButtonContainer}> 
  <TouchableHighlight style={styles.Button}
    onPress={() => {
    this.setState({selector: 'ongoing'})
    }}>
    <Text style = {styles.ResetText}>On going</Text>
  </TouchableHighlight>
  <TouchableHighlight style={styles.Button}
    onPress={() => {
    this.setState({selector: 'archived'})            
    }}>
    <Text style = {styles.ApplyText}>Archived</Text>
  </TouchableHighlight>
</View>

Answer 1

理想情况下，您要的是标签功能。

您可以尝试使用 react-native-tab-view

React native - 如何实现两个值之间的切换并根据所选值显示不同的视图

React native - How to implement a switch between two values and show a different view based on the value selected

javascript

youtube

reactjs

react-native

expo