textarea(v-model="evaluateText", ref="textarea", maxlength="200", placeholder="课程或老师满足您的期待吗？说说您的感受或建议~”)
watch: {
evaluateText (nv, ov) {
if (nv === ov) {
return
}
this.evaluateText = nv
console.log(‘value changed‘)
this.changeHeight()
}
},
method: {
changeHeight () {
let _this = this
this.$nextTick(() => {
let textArea = _this.$refs.textarea
let scrollHeight = textArea.scrollHeight // 控件所有的高度，包含滚动的那部分(不可见也会有高度)
let height = textArea.offsetHeight // 屏幕上显示的高度
if (height <= scrollHeight) {
textArea.style.height = ‘auto‘ // 恢复默认值，这个作用就是根据内容自适应textarea高度
textArea.style.height = textArea.scrollHeight + ‘px‘ // 拿到最新的高度改变textarea的高度
}
})
}
}
// css代码
textarea
width 100%
resize none
min-height 50px
outline none
display block
overflow-y auto
appearance none
border none
font-size 14px