清除 React Native TextInput [英] Clear React Native TextInput

问题描述

在 React Native 中完成 Redux AddTodo 示例.下面的第一个 AddTodo 示例使用状态来存储 TextInput 值并且工作正常.

Working through the Redux AddTodo example in React Native. The first AddTodo example below uses state to store the TextInput value and works fine.

class AddTodo extends React.Component{

    constructor(props){
        super(props);
        this.state = { todoText: "" }; 
    }
    update(e){
        if(this.state.todoText.trim()) this.props.dispatch(addTodo(this.state.todoText)); 
        this.setState({todoText: "" }); 
    }
    render(){
        return(
            <TextInput 
                value = {this.state.todoText}
                onSubmitEditing = { (e)=> { this.update(e); } }
                onChangeText = { (text) => {this.setState({todoText: text}) } } />
        );
    }
}

但是在一些 Redux 示例之后，下面的代码要短得多并且也有效，除了 TextInput value 在提交后没有被清除

However following a few of the Redux examples, the following code is much shorter and also works except that the TextInput value is not cleared after submitting

let AddTodo = ({ dispatch }) => {

  return (
      <TextInput 
          onSubmitEditing = { e => { dispatch(addTodo(e.nativeEvent.text)) } } 
      />
  )
}

有什么办法可以清除 onSubmitEditing 中的 InputText 值?

Is there any way I can clear the InputText value from onSubmitEditing?

推荐答案

将 ref 添加到您的 TextInput，例如:

Add ref to your TextInput, for example:

 <TextInput ref={input => { this.textInput = input }} />

然后调用this.textInput.clear()来清除你的输入值

then call this.textInput.clear() to clear your input value

这篇关于清除 React Native TextInput的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！