[英]want to out put text according to text input value in react-native , conditional rendering
我正在嘗試在 react-native 中創建一個虛擬終端,它可以 output 基於輸入的一些文本。然后在屏幕上顯示,我不知道我在返回時做錯了什么,到目前為止我成功地獲得了輸入文本值並渲染它但無法輸出所需的文本
import React,{useState, Component,} from 'react';
import { Text, View,StyleSheet,TextInput, TouchableNativeFeedbackBase,} from 'react-native';
import Header from './components/Header';
export default class App extends Component{
constructor(props){
super(props);
this.state={
input_terminal:'',
}}input_validation=()=>{
const {input_terminal} = this.state;
if(input_terminal=== "s"){
return <Text>
Henlo
</Text>
}}render(){
return (
<View style={styles.screen}>
<Header/>
<View style={styles.txtinline}>
<Text style={styles.txxt}>
terminal@user~$:
</Text>
<TextInput
nativeID="na"
style={styles.txtinput}
placeholder = "start from here "
placeholderTextColor = "green"
onChangeText={
input_terminal => this.setState({input_terminal})
}
onSubmitEditing={(this.input_validation)
}
></TextInput>
</View>
</View>
);
}
}
如果您想顯示您在終端中輸入的內容,您可以在<Text>
標記中添加 state 變量的值。
可能是這樣的, <Text style={styles.txxt}>terminal@user~$: {this.state.input_terminal}</Text>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.