this.state = { textareaValue: '', };
handleValueChange = (e) => { let height = parseInt(getComputedStyle(e.target).height.slice(0, -2), 10); if (e.target.scrollHeight > height) { e.target.style.height = `${e.target.scrollHeight + borderTop + borderBottom}px`; } else { while (height >= e.target.scrollHeight) { e.target.style.height = `${height - lineHeight}px`; height -= lineHeight; } e.target.style.height = `${height + lineHeight}px`; } this.setState({ textareaValue: e.target.value, }); };
const { textareaValue } = this.state;
<textarea style={{ width: '100%', border: 'none', outline: 'none', lineHeight: '20px', }} value={textareaValue} onChange={this.handleValueChange} placeholder="親!寫點建議吧,您的寶貴建議將對咱們改善園區體驗有很大幫助喲!" />