fix: autoResize issue with v-show by implementing ResizeObserver
- Problem: When using v-show to toggle the visibility of the Textarea component, the auto-resize functionality fails because this.$el.offsetParent returns null when the element is hidden. - Solution: Added a ResizeObserver to detect size changes and adjusted the resize logic to handle visibility changes. Now, the Textarea component correctly auto-resizes when it becomes visible and when its content or parent size changes.pull/6630/head
parent
69d0407fe6
commit
3ac1ff77ee
|
@ -15,17 +15,27 @@ export default {
|
|||
$pcFluid: { default: null }
|
||||
},
|
||||
mounted() {
|
||||
if (this.$el.offsetParent && this.autoResize) {
|
||||
if (this.autoResize) {
|
||||
this.observer = new ResizeObserver(() => {
|
||||
this.resize();
|
||||
});
|
||||
this.observer.observe(this.$el);
|
||||
}
|
||||
},
|
||||
updated() {
|
||||
if (this.$el.offsetParent && this.autoResize) {
|
||||
if (this.autoResize) {
|
||||
this.resize();
|
||||
}
|
||||
},
|
||||
onBeforeUnmount() {
|
||||
if (this.observer) {
|
||||
this.observer.disconnect();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
resize() {
|
||||
if (!this.$el.offsetParent) return;
|
||||
|
||||
this.$el.style.height = 'auto';
|
||||
this.$el.style.height = this.$el.scrollHeight + 'px';
|
||||
|
||||
|
|
Loading…
Reference in New Issue