reactjs – 如何从反应语义UI中获取输入

我一直在尝试从输入字段中获取输入,并且我使用了refs(通常的反应方式),但它似乎没有起作用.我得到的输入是未定义的.这是我的代码：

sendMessage = () => {
   console.log(this.inputtext.value);
}

render(){
   return(
      <div>
         <Input ref={input => this.inputtext = input;} placeholder='message'/>
         <Button onClick={this.sendMessage}>Send</Button>
      </div>
   );
}

我需要从按钮的click事件中获取输入.我无法弄清楚出了什么问题.如何正确获取输入值？

由于您使用了箭头运算符,this.inputtext.value将不起作用,
你需要写：

sendMessage(){
  console.log(this.inputtext.value);
}

在这种情况下,semantic-ui的Input Component是一个包含在输入之上的div.所以你不能直接通过ref访问input元素.您应该使用react的首选方法来获取值,即

<Input onChange={this.handleMessage.bind(this)} placeholder='message'/>


handleMessage (e) { console.log(e.target.value); }

或者不使用bind,需要babel-preset-stage-2.

<Input onChange={this.handleMessage} placeholder='message'/>


handleMessage = e => { console.log(e.target.value); }