onPress変更フラグメントビュー

Question

私はreact-nativeを使用しています。NavigationDrawerを持っています。私はListItemを押してページを変更します。私が今したいのは、ユーザーが何を押したかに応じて、ページのビューの半分だけを変更することです。

export default class Some extends Component { 

    render() { 

    return (
     <View style={styles.View1}> 
     <View style={styles.hed}> 
      <View style={styles.imageview}> 
      <Image style={styles.img} source={require('../images/logo3.png')} /> 
      </View> 
     </View> 
     <View style={styles.View2}> 
      <Page2/> 
     </View> 
     </View> 
    ); 
    } 
} 

だから私が望むのは、onPressのページ3のページ4への変更に依存します。しかし、最初のビューは一定に保たれます。

Answer 1

あなたは、このようなロジックでページを切り替えることができます

export default class Some extends Component { 
    constructor() { 
    // You define the first page seen 
    this.state = { currentPage: 1 }; 
    } 

    onPress =() => { 
    // Here your logic to choose the page with: 
    this.setState({ currentPage: ... }); 
    } 

    render() { 
    // All of your pages 
    const pages = { 
     1: <Page1 />, 
     2: <Page2 />, 
     3: <Page3 />, 
    }; 
    const { currentPage } = this.state; 

    return (
     <View style={styles.View1}> 
     <View style={styles.hed}> 
      <View style={styles.imageview}> 
      <Image style={styles.img} source={require('../images/logo3.png')} /> 
      </View> 
     </View> 
     <View style={styles.View2}> 
      {/* Display the selected page */} 
      {pages[currentPage]} 
     </View> 
     </View> 
    ); 
    } 
}