We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
操作系统:windows/浏览器版本:127.0.6533.99(正式版本)(64位)/vue版本:3.4.27
https://run.iviewui.com/PNnAb3uS
如果初始化v-model绑定文本内容过多,渲染的文本框不会自适应高度,需要主动输入才会触发自适应高度
请修复这个bug,不然的话就要使用 :autosize="{minRows: x,maxRows: x}"这种了
实际结果渲染内容文本超出不自适应高度
The text was updated successfully, but these errors were encountered:
@L-hailong 你好!我是一个可以帮助你解决bug,回答问题并成为贡献者的机器人。我在等待人类维护者的同时会为你提供帮助。😊
要修复 <Input type="textarea" :autosize="true" /> 组件在初始化时文本内容过多而高度不自动适应的问题,可以确保在组件初始化时正确调用 calcTextareaHeight 函数来计算高度。
<Input type="textarea" :autosize="true" />
calcTextareaHeight
以下是一个示例,展示了如何在 Vue 组件中使用 calcTextareaHeight 函数来调整文本区域的高度:
<template> <textarea ref="textarea" v-model="content" @input="resizeTextarea" ></textarea> </template> <script> import calcTextareaHeight from 'path/to/calcTextareaHeight'; export default { data() { return { content: 'Initial large amount of text content...', }; }, mounted() { this.resizeTextarea(); }, methods: { resizeTextarea() { const textarea = this.$refs.textarea; const { height } = calcTextareaHeight(textarea); textarea.style.height = height; }, }, }; </script> <style scoped> textarea { width: 100%; box-sizing: border-box; } </style>
在这个示例中:
resizeTextarea
input
mounted
这样可以确保文本区域的高度在初始化和用户输入时都能根据内容正确调整 [1].
To continue talking to Dosu, mention @dosu.
Sorry, something went wrong.
No branches or pull requests
Environment
操作系统:windows/浏览器版本:127.0.6533.99(正式版本)(64位)/vue版本:3.4.27
Reproduction link
https://run.iviewui.com/PNnAb3uS
Steps to reproduce
如果初始化v-model绑定文本内容过多,渲染的文本框不会自适应高度,需要主动输入才会触发自适应高度
What is expected?
请修复这个bug,不然的话就要使用 :autosize="{minRows: x,maxRows: x}"这种了
What is actually happening?
实际结果渲染内容文本超出不自适应高度
The text was updated successfully, but these errors were encountered: