ReactJS-Как установить значение для textfield из material-ui?

У меня есть selectField, и я хочу установить значение на нем. Допустим, я набираю на нем, и когда я нажимаю кнопку, Кнопка вызовет функцию, которая сбросит значение текстового поля?

<TextField hintText="Enter Name" floatingLabelText="Client Name" autoWidth={1} ref='name'/>
6
material-ui reactjs

2 ответов

вы можете сделать это таким образом 

export default class MyCustomeField extends React.Component {

      constructor(props) {
        super(props);

        this.state = {
          value: 'Enter text',
        };
      }

      handleChange = (event) => {
        this.setState({
          value: event.target.value,
        });
      };

     handleClick = () => {
        this.setState({
          value:'',
        });
      };

      render() {
        return (
          <div>
            <TextField
              value={this.state.value}
              onChange={this.handleChange}
            />
            <button onClick={this.handleClick}>Reset Text</button>
          </div>
        );
      }
    }
13

считается, что правильный способ-контролировать компонент в сценарии, подобном принятому ответу, но вы также можете контролировать значение таким грубым и культурно неприемлемым способом.

<TextField ref='name'/>

this.refs.name.getInputNode().value = 'some value, hooray'

и вы можете, конечно, получить значение, как так

this.refs.name.getValue()
3