使用react-bootstrap获取输入文本的值

我尝试将值转换为输入文本,然后使用react-bootstrap将其添加到文本区域。

我知道我必须使用ReactDOM.findDOMNode来获得ref的价值。我不明白怎么了。

这是我的代码:

import React from 'react';
import logo from './logo.svg';
import ReactDOM from 'react-dom';
import { InputGroup, FormGroup, FormControl, Button} from 'react-bootstrap';
import './App.css';
class InputMessages extends React.Component {
constructor(props) { 
super(props);
this.handleChange =      this.handleChange.bind(this); 
    this.GetMessage= this.GetMessage.bind(this); 
this.state = {message: ''};
}   
handleChange(event)
{    
this.setState({message: this.GetMessage.value});
}
GetMessage()
{   
return ReactDOM.findDOMNode(this.refs.message     );
 }
 render() {
    var message = this.state.message;
    return(
 <FormGroup > 
 <FormControl
 componentClass="textarea" value={message} />
 <InputGroup> 
 <FormControl type="text" ref='message' /> 
    <InputGroup.Button>
    <Button bsStyle="primary" onClick={this.handleChange}>Send
    </Button>
    </InputGroup.Button> 
    </InputGroup>
    </FormGroup>
    );
   }
   }  
   export default InputMessages;
法瓦兹

将Input ref添加到您的表单中:

<FormControl inputRef={ref => { this.myInput = ref; }} />

所以现在你得到像

this.myInput.value

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

我如何使用react获取文本输入字段的值

使用document.getElementsByClassName获取输入文本的值

如何通过使用集合<Part>获取输入文本值

如何使用JavaScript获取文本输入字段的值?

如何使用jquery获取动态输入文本的值?

使用jQuery获取基于数据属性的输入下拉文本值

使用 Vanilla JavaScript 从输入文本中获取更新值

在React / Redux中使用默认值输入文本

使用React JS时输入类型文本的值未更新

如何使用react获取动态创建的输入字段的值

使用React在输入上通过onPaste事件获取双倍的值

在React JS中按下Enter键时如何获取输入文本字段值?

如何在 react.js 中获取动态文本输入的值?

React Bootstrap调整文本输入的宽度

Bootstrap 标签输入错误,无法使用设置文本框的值

如何获取要在 js 中使用的文本框的值/输入?

如何获取html表中选择行的值并使用javasricpt在输入文本中显示它们?

如何使用jQuery从表中获取所有输入文本框值

通过在 javascript 中使用 Name 而不是 Id 来获取输入类型文本的值

使用 jQuery 或纯 JS 获取多选框的值并显示在输入文本上

使用htmlfor获取输入值

使用JavaScript获取输入值

javascript获取并使用输入值

从 React-Bootstrap 输入获取数据

如何使用angular从嵌套组件模式ngx-bootstrap获取输入值

Meteor(REACT) -- 无法更新输入文本值

在Bootstrap输入元素上使用内联文本

在select2中获取selected选项的值,然后使用jquery将值设置为输入文本?

使用Scanner.next()获取文本输入