我有一个select输入,我使用Material-UI lib中的TextField组件创建 . 选择某个选项后,我需要手动失去焦点 . 我尝试使用'inputRef' prop对TextField的引用,这很好但是当我尝试在this.selectInput.current上触发blur()函数时,就像我在这里做的但没有MaterialUI lib .

class Select extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
    	selected: ''
    }
    
    this.inputRef = React.createRef();
    this.onChangeHandler = this.onChangeHandler.bind(this)
  }
  
  onChangeHandler(e){
  
	this.inputRef.current.blur()

  	this.setState({
    	selected: e.target.value
    })
  }
  
  render() {
  	const {selected} = this.state;
  
    return (
      <select value={selected}
          onChange={this.onChangeHandler}
          ref={this.inputRef}>
        <option value=''>Please select</option>
        <option value='1'>One</option>
        <option value='2'>Two</option>
      </select>
    )
  }
}

ReactDOM.render(<Select />, document.querySelector("#app"))
<script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>

<div id="app"></div>

我得到一个错误,即blur()函数不存在 . 我知道Material UI使用了自定义el . 创建UI,我只是一个div或其他目标 . 所以问题是当使用TextField组件或者我做错了什么时,另一种获得确切行为的方法(失去对select事件的关注)?

材料UI v1.3.1 |反应v16.4.2