リアクトネイティブでコンポーネントを非表示にする方法

反応ネイティブの非表示コンポーネントは、「display:none/flex」属性を通じて実装できます。具体的な実装方法は次のとおりです: 1. 対応する反応ファイルを開きます。 2. 「”; 3. ボタンをクリックして状態を変更し、コンポーネントを非表示にします。

このチュートリアルの動作環境: Windows 10 システム、react18.0.0 バージョン、Dell G3 コンピューター。

反応ネイティブでコンポーネントを非表示にする方法は?

#具体的な問題の説明:

A の switchAndroid の値を通じてモジュール B の表示と非表示を制御するにはどうすればよいですか? すべて表示

#問題解決策:

展開および折りたたみ機能の実装:表示:なし / フレックス

ボタンをクリックして状態を変更し、コントロールを表示/非表示にします

state = {
displayShuoming:'none',
btnShuoming:'>'
};
scrollShuoming =()=>{
let dis = this.state.displayShuoming;
if(dis == 'none'){
this.setState({
displayShuoming:'flex',
btnShuoming:'>'
})
}else{
this.setState({
displayShuoming:'none',
btnShuoming:'v'
})
}
}
render(){
return (
<View style={[styles.bg_white,styles.flex_col,styles.pl_20,styles.pr_20,styles.mt_10]}>
<View style={[styles.flex_row,styles.bg_white,styles.mt_10,styles.pb_10]}>
<Text style={[styles.flex_3]}>产品说明</Text>
<Button color=&#39;#ddd&#39; style={{color:&#39;#ccc&#39;}} title={this.state.btnShuoming} onPress={this.scrollShuoming}/>
</View>
<View style={{display:this.state.displayShuoming}}>
<View style={[styles.flex_col,styles.border_top,styles.pt_10]}>
<Text style={[styles.text_gray]}>投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；投资资金安全由保险公司承保；</Text>
</View>
</View>
</View>
)
}

推奨される学習: "

反応ビデオチュートリアル

"

以上がリアクトネイティブでコンポーネントを非表示にする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。