search

ElemeFE / element

A Vue.js 2.0 UI Toolkit for Web
https://element.eleme.io/
MIT License
54.1k stars 14.64k forks source link

[Bug Report] Popper for DatePicker Appear at the Wrong Place when Its Type Changes #10534

Closed HualiangLI closed 6 years ago

HualiangLI commented 6 years ago

Element UI version

2.3.2

OS/Browsers version

all / all

Vue version

2.5.17-beta.0

Reproduction Link

https://jsfiddle.net/KrisLeeSH/mmx38qxw/1215/

Steps to reproduce

  1. click "month" button, focus to the date-picker component
  2. click "daterange" button, focus to the date-picker component
  3. click "month" button, focus to the date-picker component and pay attention to the popper-panel's position

What is Expected?

The popper shows in the right position (on the bottom of the input component)

What is actually happening?

The popper appears at the top-left corner of the page

HualiangLI commented 6 years ago

And sometimes when the date-picker's type changed, the popper panel wouldn't show after focus in the input area.

Leopoldthecoder commented 6 years ago

You need to use key to force a re-render: https://jsfiddle.net/mmx38qxw/1218/ . Actually it's discouraged to mutate type dynamically.