From 66af6417a2cd79a6a350798b1498e0ce05b97b91 Mon Sep 17 00:00:00 2001
From: Gimmy <975402925@qq.com>
Date: Tue, 7 Jan 2025 19:40:29 +0800
Subject: [PATCH] fix(grid): [grid] fix can not select first option when value
 is empty

---
 .../vue/src/grid/src/adapter/src/renderer.ts  | 28 ++++++++++++-------
 1 file changed, 18 insertions(+), 10 deletions(-)

diff --git a/packages/vue/src/grid/src/adapter/src/renderer.ts b/packages/vue/src/grid/src/adapter/src/renderer.ts
index 387c14e4ad..3320c32524 100644
--- a/packages/vue/src/grid/src/adapter/src/renderer.ts
+++ b/packages/vue/src/grid/src/adapter/src/renderer.ts
@@ -100,24 +100,32 @@ function getEvents(renderOpts, params, context) {
 }
 
 function renderOptions(h, options, renderOpts, params, context) {
-  let { optionProps = {} } = renderOpts
-  let labelProp = optionProps.label || 'label'
-  let valueProp = optionProps.value || 'value'
-  let { column, row } = params
-  let { formatConfig } = column.own
-  let cellValue = isSyncCell(renderOpts, params, context) ? getCellValue(row, column) : column.model.value
+  const { optionProps = {} } = renderOpts
+  const labelProp = optionProps.label || 'label'
+  const valueProp = optionProps.value || 'value'
+  const { column, row } = params
+  const { formatConfig } = column.own
+  const cellValue = isSyncCell(renderOpts, params, context) ? getCellValue(row, column) : column.model.value
 
   if (!options && formatConfig && formatConfig.data) {
     options = formatConfig.data
   }
-
-  return options.map((item, index) => {
-    let attrs = {
-      domProps: { value: item[valueProp], selected: item.value === cellValue },
+  let hasSelected = false
+  const optionsList = options.map((item, index) => {
+    const selected = item.value === cellValue
+    if (selected) {
+      hasSelected = true
+    }
+    const attrs = {
+      domProps: { value: item[valueProp], selected },
       key: index
     }
     return h('option', attrs, item[labelProp])
   })
+  if (options.length && !hasSelected) {
+    optionsList.unshift(h('option', { style: 'display:none', selected: true }, ''))
+  }
+  return optionsList
 }
 
 function renderOptgroups(h, options, params, context) {