210625 Javascript Textarea Input 이벤트에 맞춰 길이 늘리기

Javascript Textarea Input 이벤트에 맞춰 길이 늘리기

Vanilla Javascript

const textarea = document.querySelector('textarea')

textarea.addEventListener('input', e => {
  textarea.style.height = textarea.scrollHeight + 'px'
})

Vue.js

const textareaWrap = this.$refs.textarea.$el
const textarea = textareaWrap.querySelector('textarea')

textarea.style.height = 'auto'
textarea.style.height = textarea.scrollHeight + 'px'
textareaWrap.style.height = textarea.scrollHeight + 'px'

Demo

See the Pen Textarea Height by Jaeeun Jung (@dmsdl950823) on CodePen.