docs(time-select): [time-select] optimize docs and demos (#1418)

* docs(time-select): [time-select] optimize docs and demos

* docs(time-select): [time-select] optimize docs and demos

* docs(time-select): [time-select] optimize docs and demos

* docs(time-select): [time-select] optimize docs and demos

examples/sites/demos/pc/app/time-select/focus-composition-api.vue

@@ -13,7 +13,7 @@ const value = ref('')
 const timeSelectRef = ref()
 
 function hanleFocus() {
-  timeSelectRef.value.$el.querySelector('input').focus()
+  timeSelectRef.value.focus()
 }
 </script>
 

examples/sites/demos/pc/app/time-select/focus.spec.ts

@@ -4,7 +4,6 @@ test('事件', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('time-select#focus')
   await page.getByRole('button', { name: '手动获取焦点' }).click()
-  // 需要先解决time-select的focus事件
-  // const focus = page.getByRole('textbox', { name: '选择时间' })
-  // await expect(focus).toBeFocused()
+  const focus = page.getByRole('textbox', { name: '选择时间' })
+  await expect(focus).toBeFocused()
 })

examples/sites/demos/pc/app/time-select/focus.vue

@@ -20,7 +20,7 @@ export default {
   },
   methods: {
     hanleFocus() {
-      this.$refs.timeSelect.$el.querySelector('input').focus()
+      this.$refs.timeSelect.focus()
     }
   }
 }

packages/renderless/src/picker/index.ts

@@ -449,7 +449,7 @@ export const secondInputId =
 export const focus =
   ({ api, props, vm }) =>
   () =>
-    !props.isRange ? vm.$refs.reference.focus() : api.handleFocus()
+    !props.isRange ? vm.$refs.reference.querySelector('input').focus() : api.handleFocus()
 
 export const blur = (state) => () => state.refInput.forEach((input) => input.blur())