一个小的但有时有用的Vue.js组件,可根据您键入内容的长度自动调整文本字段的大小。
# Yarn
$ yarn add vue-autosize-input
# NPM
$ npm install vue-autosize-input --save
1.导入自动大小输入组件。
import AutosizeInput from 'vue-autosize-input';
2.将自动调整大小的输入添加到应用模板。
<template>
<autosize-input
v-model="value" />
</template>
3.注册组件并完成。
export default {
components: {
AutosizeInput,
},
data () {
return {
value: '',
}
}
}
4.输入值更改时执行回调。
<template>
<autosize-input
v-model="value"
@change="onChange />
</template>
export default {
components: {
AutosizeInput,
},
data () {
return {
value: '',
}
},
methods: {
onChange (e) {
// 使用e.target.value进行操作
},
},
}