React bootstrap textarea example with set value in state

Bootstrap , React.js

Nicesnippets

1326

20-05-2020


Hello Friends,

In this tutorial we show demo of react bootstrap textarea. using textarea you can get multiline text. if you have question How to Use a Multiline Text Area in ReactJS then we provide example. how to get textare value on change. ReactJS textArea component getting started. Submitting multiple lines from one textarea in react js bootstrap.

In many form we are use textare input. You can use this demo in form submit. textarea is by default autosize but you can set minimum height and width. bootstrap also provide row attribute for height width. following is simple form input textarea react js example.

/src/BootstrapTextarea.js

import React from 'react'

import Form from 'react-bootstrap/Form'

class BootstrapTextarea extends React.Component{

constructor(){

super();

this.state = {

address:null

}

this.handleInputChange = this.handleInputChange.bind(this);

}

handleInputChange(event) {

this.setState({

address: event.target.value

});

console.warn(this.state)

}

render(){

return(

<div>

<Form>

<Form.Group controlId="exampleForm.ControlTextarea1">

<Form.Label>Example textarea</Form.Label>

<Form.Control as="textarea" rows="3" name="address" onChange={this.handleInputChange} />

</Form.Group>

</Form>

</div>

)

}

}

export default BootstrapTextarea;

I hope it can help you...


Recommended Posts