如何清除组件的“TextInput”按钮

Question

我在react-native-elements Input组件上使用react-native-testing-library。组件在编辑时显示clear按钮。

如何点击clear按钮来测试副作用？

这不起作用：

const addressField = component.getByPlaceholder("Address");
addressField.clear();

// TypeError: addressField.clear is not a function

Answer 1

您可以使用clear option。

handleSearchClear = () => {
this.setState({ query: "" })
}
....
<Input

  placeholder='BASIC INPUT'
  onClear={this.handleSearchClear}
  value={this.state.query}
/>

或者，您可以使用ref

this.input.clear();
...
<Input

  placeholder='BASIC INPUT'
  ref={ref => {this.input = ref;}}
  value={this.state.query}
/>