jsx中的if-else语句:ReactJS

JavaScript React.js

王者一打九

2020-05-28

当需要指定特定状态时,我需要更改渲染功能并运行一些子渲染功能,

例如:

render() {
    return (   
        <View style={styles.container}>
            if (this.state == 'news'){
                return (
                    <Text>data</Text>
                )
            }
        </View>
    )
}

如何在不更改场景的情况下实现这一点,我将使用标签动态更改内容。

第4229篇《jsx中的if-else语句:ReactJS》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

1个回答
DavaidTony宝儿 2020.05.28

我喜欢这样,而且效果很好。

constructor() {
   super();

   this.state ={
     status:true
   }
}

render() {
   return( 

     { this.state.status === true ?
           <TouchableHighlight onPress={()=>this.hideView()}>
             <View style={styles.optionView}>
               <Text>Ok Fine :)</Text>
             </View>
          </TouchableHighlight>
           :
           <Text>Ok Fine.</Text>
     }
  );
}

hideView(){
  this.setState({
    home:!this.state.status
  });
}

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android