Skip to content

Datepicker menu does not open when centered is enabled #1195

@alexpopovme

Description

@alexpopovme

When the centered prop is enabled, the datepicker menu does not open after clicking the input.
This issue can be reproduced directly in the documentation example:

🔗 https://vue3datepicker.com/props/general-configuration/#centered

Clicking the input does nothing — the menu never appears.


Steps to Reproduce

  1. Use the defaul datepicker with the centered prop:
  2. Click the input field.
  3. The menu does not open.

Expected Behavior

The menu should open normally when the input is clicked, when centered is enabled.


Actual Behavior

The menu does not open at all.


Additional Information

The issue appears to be caused by the internal shouldRender ref, which remains false when centered is active.

The menu uses a condition:

v-if="isOpen && shouldRender"

Since shouldRender never becomes true in this mode, the menu never renders and therefore cannot open.

There seems to be a conflict between the centered behavior and the rendering logic that relies on shouldRender.


Environment

  • Browser: Chrome v142.0.7444.162

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions