vue3+elementplus：el-dialog内使用el-time-picker和el-date-picker时，不正常

[lazycat818]

环境：

vue3:3.2.29

element plus:2.0.3(2.0.2也试过，问题一样)

vite:2.7.2

chrome: 96.0.4664.110（正式版本） （64 位）

==========================================================

问题：（1）打开dialog时，时间或日期选择器会自动获得焦点，但poper偏位；（2）点击取消、确定按钮或点击某一日期，poper不能自己关闭，关闭poper的唯一途径点击dialog上能获得焦点的输入框；

==========================================================

代码：

<template>

  <div class="box">

    <el-button type="primary" @click="dialogVisible = true">测试</el-button>

      <el-dialog

      v-model="dialogVisible"

      title="Tips"

      width="50%"

      :destroy-on-close="true"

    >

      <div class="example-basic">

        <el-time-picker v-model="value1" arrow-control placeholder="Arbitrary time">

        </el-time-picker>

        <el-time-picker v-model="value2" arrow-control placeholder="Arbitrary time">

        </el-time-picker>

        <el-date-picker

        v-model="value3"

        type="date"

        placeholder="Pick a day"

        :disabled-date="disabledDate"

        :shortcuts="shortcuts"

      >

      </el-date-picker>

      </div>

 

      <template #footer>

        <span class="dialog-footer">

          <el-button @click="dialogVisible = false">Cancel</el-button>

          <el-button type="primary" @click="dialogVisible = false"

            >Confirm</el-button

          >

        </span>

      </template>

    </el-dialog>

  </div>

</template>

 

<script lang="ts" setup>

import { ref } from 'vue'

 

const dialogVisible = ref(false)

const value1 = ref()

const value2 = ref()

const value3 = ref()

 

</script>

 

<style lang="scss" scoped>

  .box {

    padding: 15px;

  }

</style>

[lazycat818]

大家有没有遇见这个问题？难道我是独一份？

[lazycat818]

2.0.4版本已解决此问题

[Mi_se]

同，找了半天错误

[weixin_63188213]

dialog里面嵌套日期选择器解决了，可是抽屉还有