kenhyuwa / litepie-datepicker

Litepie Datepicker is a date range picker component for Vue.js and Tailwind CSS, dependent to day.js.
https://litepie.com
MIT License
374 stars 75 forks source link

The picker did not show up when i use the litepie-picker in the Dialog component #71

Open syifeng opened 2 years ago

syifeng commented 2 years ago

In my dialog component when i focused in the litepie-datapicker , the pieker did not show, and the property 'isShow' in setUp did not switch to true either The dialog

<div
    v-if="show"
    class="fixed top-0 left-0 right-0 bottom-0 dark:bg-white/40 bg-slate-900/60 flex justify-center items-center"
    style="z-index: 2000;"
    @click="emits('close')"
  >
    <span
      v-if="closable"
      class="absolute right-0 top-0 p-2 z-50 cursor-pointer bg-white/30 rounded-full"
      @click="emits('close')">
      <Icon icon="ep:close-bold" width="24"/>
    </span>
    <div
      class="bg-slate-100 rounded-md relative dark:bg-slate-800"
      :class="[width]"
      @click.stop=""
    >
      <div
        v-if="title"
        class="text-lg text-center my-3 top-0 bg-slate-50 dark:bg-stlate-900"
      >{{ title }}</div>
      <slot name="header" />
      <slot />
    </div>
  </div>

The litepie code


    <bs-dialog
      :show="updateWorkDialog.show"
      closable
      width="w-[30rem]"
      @close="updateWorkDialog.show = false"
    >
      <div class="p-3">
        <div
          class="relative"
        >
          <litepie-datepicker
            v-model="updateWorkDialog.model.workDay"
            i18n="zh-cn"
          />
        </div>
      </div>
    </bs-dialog>