fix(components): [el-select-v2] set option default value 0 (#4417)

* fix(components): [el-select-v2] set option defalut value 0

* fix: add hasModelValue

packages/components/select-v2/__tests__/select.spec.ts

@@ -803,6 +803,31 @@ describe('Select', () => {
     expect(placeholder.text()).toBe(DEFAULT_PLACEHOLDER)
   })
 
+  it('default value is 0', async () => {
+    const wrapper = createSelect({
+      data: () => ({
+        value: 0,
+        options: [
+          {
+            value: 0,
+            label: 'option_a',
+          },
+          {
+            value: 1,
+            label: 'option_b',
+          },
+          {
+            value: 2,
+            label: 'option_c',
+          },
+        ],
+      }),
+    })
+    await nextTick()
+    const placeholder = wrapper.find(`.${PLACEHOLDER_CLASS_NAME}`)
+    expect(placeholder.text()).toBe('option_a')
+  })
+
   it('emptyText error show', async () => {
     const wrapper = createSelect({
       data() {

packages/components/select-v2/src/select.vue

@@ -198,7 +198,7 @@
                 states.isComposing ||
                 (placeholder && multiple
                   ? modelValue.length === 0
-                  : !modelValue),
+                  : !hasModelValue),
             }"
           >
             {{ currentPlaceholder }}

packages/components/select-v2/src/useSelect.ts

@@ -95,12 +95,18 @@ const useSelect = (props: ExtractPropTypes<typeof SelectProps>, emit) => {
     return totalHeight > props.height ? props.height : totalHeight
   })
 
+  const hasModelValue = computed(() => {
+    return (
+      props.modelValue !== undefined &&
+      props.modelValue !== null &&
+      props.modelValue !== ''
+    )
+  })
+
   const showClearBtn = computed(() => {
     const hasValue = props.multiple
       ? Array.isArray(props.modelValue) && props.modelValue.length > 0
-      : props.modelValue !== undefined &&
-        props.modelValue !== null &&
-        props.modelValue !== ''
+      : hasModelValue.value
 
     const criteria =
       props.clearable &&
@@ -659,7 +665,7 @@ const useSelect = (props: ExtractPropTypes<typeof SelectProps>, emit) => {
         states.cachedOptions = []
       }
     } else {
-      if (props.modelValue) {
+      if (hasModelValue.value) {
         const options = filteredOptions.value
         const selectedItemIndex = options.findIndex(
           (option) => getValueKey(option) === props.modelValue
@@ -746,6 +752,7 @@ const useSelect = (props: ExtractPropTypes<typeof SelectProps>, emit) => {
     inputWrapperStyle,
     popperSize,
     dropdownMenuVisible,
+    hasModelValue,
     // readonly,
     shouldShowPlaceholder,
     selectDisabled,