Question

我有一个React Native项目。该视图最初有style = {{ Display:null }}，但我想将其更改为style = {{Display:'none'}}。

我该怎么做？

<View style={{Dispaly:null}} >
<TouchableOpacity onPress={???}>
<Text>hide</Text>
</TouchableOpacity>
</View>

Answer 1

有很多方法可以做到：

示例1）

constructor(){
   super()
   this.state = {
      visibility : 'flex'
   } 
}

render(){
  return (
    <View style={{display:this.state.visibility}}>
      <TouchableOpacity onPress={()=>this.setState({visibility:'none'})}>
      <Text>hide</Text>
      </TouchableOpacity>
    </View>
  )
}

当您按下按钮时，可见性从“flex”变为“none”。

请注意，this.state.visibility的默认值为“flex”。根据{{3}}显示，仅支持'flex'和'none'。

示例2）

constructor(){
    super()
    this.state = {
          visibility : true
    }
  }

  myView(){
    return(
      <View >
        <TouchableOpacity onPress={()=>this.setState({visibility:false})}>
        <Text>hide</Text>
        </TouchableOpacity>
      </View>
    )
  }

  render() {
    return (
      <View>
       {this.state.visibility == true ?this.myView() :null}
      </View>
    );
  }

在这种情况下，this.state.visibility是一个布尔值。它的默认值为true。在render方法中，我们检查它的值。如果确实如此，我们调用myView（）方法，否则我们什么都不做

如何在React Native中的View上更改显示名称？

1 个答案: