How to clear the autocomplete's input in Material-ui after an onChange?

• material-ui

  7 76,637 10.0 JavaScript

  Discontinued MUI Core (formerly Material UI) is the React UI library you always wanted. Follow your own design system, or start with Material Design. [Moved to: https://github.com/mui/material-ui] (by mui-org)

  

Reactjs In the hooks version of material UI I can't seem to be able to clear the autocomplete after an onChange event: // @flowimport React, { useRef, useState } from "react";import "./Autocomplete.scss";import AutocompleteUI from "@material-ui/lab/Autocomplete";import TextField from "@material-ui/core/TextField";function Autocomplete(props) { const { options } = props; const [value, setValue] = useState(); const container = useRef(); const input = useRef(); function onChange(event, newValue) { if (!newValue) return; props.onChange(newValue); setValue(undefined); input.current.value = ""; event.target.value = ""; } function renderInput(params) { return ( ); } return ( {value} option.title} renderInput={renderInput} value={value} onChange={onChange} /> );}export default Autocomplete; Diving into the source code I've noticed the component uses useAutocomplete hook internally. However, neither setInputValue nor resetInputValue which live internally inside that hook are exposed outside. Is there a way to accomplish an input clear after an onChange? Answer link : https://codehunter.cc/a/reactjs/how-to-clear-the-autocompletes-input-in-material-ui-after-an-onchange

• SurveyJS

  surveyjs.io featured

  Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  

Suggest a related project