React访问input内容，不使用onChange方法

React访问input标签内容

很常用的需求，在react的某个方法中需要访问render到页面上的某个input，有几种方法，这里介绍一种最简单的方法（类似html中的getElementById）：

ref

使用隐藏属性ref，指定ref的值，即可以在组件中任何地方获取该标签对象：
render的return中返回：

 <form onSubmit={this.submitHandler.bind(this)}>
     <label>你要干啥？</label>
     <input ref="newTodo"></input>
     <button >
         添加 #{this.state.items.length+1}
     </button>
 </form>

在回调函数中：

submitHandler(e){
    e.preventDefault();//form默认会打开新网页刷新
    if(!this.refs.newTodo.value.length){
        return;
    }
    const item={
        id:Date.now(),
        text:this.refs.newTodo.value
    }
    this.setState({
        items:this.state.items.concat(item)
    })

}

---

【2020年5月25日 20点41分 修订】
由于string ref已经废弃，所以请减少使用该方法！最新用法参照一次性搞定React的Ref功能