element-ui 使用多个时间选择器 造成弹窗错位问题

//给每一个 el-date-picker 标签 添加一个 key 值      key="value"  
<el-form-item>
        <el-select v-model="listQuery.Time" placeholder="时间选择">
          <el-option
            v-for="item in timeSelection"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
 <el-form-item v-if="listQuery.Time == 'Month'">
        <el-date-picker
          v-model="MounthTime"
          key="'month'"
          type="month"
          placeholder="选择月">
        </el-date-picker>
      </el-form-item>
 
      <el-form-item v-if="listQuery.Time == 'Day'">
        <el-date-picker
          v-model="DayTime"
          key="'day'"
          type="date"
          placeholder="选择日期">
        </el-date-picker>
      </el-form-item>
 
      <el-form-item v-if="listQuery.Time == 'Scope'">
        <el-date-picker
          v-model="ScopeTime"
          key="'scope'"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期">
        </el-date-picker>
      </el-form-item>