From 2111d8a88f360e205c3b9ce0fe268e2ac1bc88d0 Mon Sep 17 00:00:00 2001
From: zhaozhongyu <whuzhaozhongyu@foxmail.com>
Date: Tue, 3 Aug 2021 08:51:08 +0800
Subject: [PATCH] fix: select-v2's dropdown width wrong if create in
 style(display: none) (#2791)

Co-authored-by: zhaozhongyu <zhaozhongyu@xunlei.com>
---
 packages/select-v2/src/useSelect.ts | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/packages/select-v2/src/useSelect.ts b/packages/select-v2/src/useSelect.ts
index 032a5fa09f..3e34e2024e 100644
--- a/packages/select-v2/src/useSelect.ts
+++ b/packages/select-v2/src/useSelect.ts
@@ -72,6 +72,7 @@ const useSelect = (props: ExtractPropTypes<typeof SelectProps>, emit) => {
 
   // data refs
   const selectedIndex = ref(-1)
+  const popperSize = ref(-1)
 
   // DOM & Component refs
   const controlRef = ref(null)
@@ -157,9 +158,9 @@ const useSelect = (props: ExtractPropTypes<typeof SelectProps>, emit) => {
 
   const collapseTagSize = computed(() => selectSize.value)
 
-  const popperSize = computed(() => {
-    return selectRef.value?.getBoundingClientRect?.()?.width || 200
-  })
+  const calculatePopperSize = () => {
+    popperSize.value = selectRef.value?.getBoundingClientRect?.()?.width || 200
+  }
   // const readonly = computed(() => !props.filterable || props.multiple || (!isIE() && !isEdge() && !expanded.value))
 
   const inputWrapperStyle = computed(() => {
@@ -345,6 +346,7 @@ const useSelect = (props: ExtractPropTypes<typeof SelectProps>, emit) => {
 
   const handleResize = () => {
     resetInputWidth()
+    calculatePopperSize()
     popper.value?.update?.()
     if (props.multiple) resetInputHeight()
   }
@@ -616,6 +618,7 @@ const useSelect = (props: ExtractPropTypes<typeof SelectProps>, emit) => {
         states.selectedLabel = ''
       }
     }
+    calculatePopperSize()
   }
 
   // in order to track these individually, we need to turn them into refs instead of watching the entire