Question

我希望按Enter键使搜索栏为空，而不是获取多行，即将multiline属性设置为false。但是我还观察到，读取回车键本机事件多行属性应该为true。

handlePress=(e)=>{
        if(e.nativeEvent.key == "Enter"){
          this.setState({searchTerm:''});
        }
    }
render(){
        return(
          <View style={styles.container}>
              <FontAwesome name={'search'} style={styles.searchIcon}/>
              <TextInput
                  placeholder='Search...'
                  value = {this.state.searchTerm}
                  multiline={true}
                  style={styles.input}
                  onKeyPress={this.handlePress}
              />
          </View>
        );
    }

Answer 1

我能想到的解决方案是

state={
   multiLine: false
}

    handlePress=(e)=>{
        if(e.nativeEvent.key == "Enter"){
          this.setState({searchTerm:''});
        }
         this.setState({ multiLine:!this.state.multiLine })
    }
render(){
        return(
          <View style={styles.container}>
              <FontAwesome name={'search'} style={styles.searchIcon}/>
              <TextInput
                  placeholder='Search...'
                  value = {this.state.searchTerm}
                  multiline={ this.state.multiLine }
                  style={styles.input}
                  onKeyPress={this.handlePress}
              />
          </View>
        );
    }

所以我尝试了并且没有遇到任何问题，可能有其他事情导致了这个问题，这是我所做的

<Input 
                placeholder = "Task"
                multiline={ this.state.multiLine }
                style= {{ marginTop:8 }}
                onChange= {e => this.setState({ task: e.nativeEvent.text })}
                value= {this.state.task}
            />

如何按Enter键使多行属性为假？

1 个答案: