React Native 如何使用useRef以编程方式清除TextInput

xeufq47z  于 2023-01-21  发布在  React
关注(0)|答案(2)|浏览(255)

我尝试在使用useRef提交表单后自动清除TextInput

const inputRef = useRef()

这将显示属性列表。但是,以下操作无效:

const clearInput = () => {
        inputRef.current.value = ""
    }

它显示value不存在。
我目前使用的是react-native-google-places-autocomplete

<GooglePlacesAutocomplete
    ref={inputRef}
    placeholder='Search'
    minLength={1}
    autoFocus={false}
    returnKeyType={'search'} 
    keyboardAppearance={'light'} /keyboardAppearance https://facebook.github.io/react-native/docs/textinput.html#keyboardappearance
    listViewDisplayed={focus}   
    fetchDetails={true}
    textContentType={'fullStreetAddress'}
    autoCapitalize={'words'}
    selectionColor={'red'}
    clearButtonMode={'always'}
    // other properties
/>
bxfogqkk

bxfogqkk1#

你的ref inputRef并没有引用文本输入,而是引用了GooglePlacesAutocomplete组件,该组件中的文本输入就是你需要引用的。
如果查看the code,可以看到它的ref定义为"textInput"(第717行),并且自动完成组件使用this.refs.textInput选择它(第166行)
考虑到这一点,您应该能够通过autocomplete组件访问文本输入引用,如下所示:
inputRef.current.refs.textInput

2w2cym1i

2w2cym1i2#

您也可以使用inputRef.current?.clear();

相关问题