vue-popper icon indicating copy to clipboard operation
vue-popper copied to clipboard

Do you have any plan to update `slot` with `v-slot` directive?

Open purdx opened this issue 6 years ago β€’ 8 comments

Popper did not work when I tried to replace slot with v-slot. slot is deprecated in Vue 2.6.0, Do you have any plan to use new syntax (v-slot)?

purdx avatar Apr 06 '19 11:04 purdx

I looked into this a bit, I think it's related to vuejs/vue#5427. This line no longer works

superMDguy avatar Apr 06 '19 18:04 superMDguy

The vue bug is corrected in https://unpkg.com/[email protected]/ #https://github.com/vuejs/vue/issues/9421

joelpro2 avatar Apr 23 '19 15:04 joelpro2

Still doesn't seem to work.

When I do:

<template v-slot:reference>
    <div class="popover">
        Hover me
    </div>
</template>

It doesn't work.

hoopyfroody avatar Aug 21 '19 07:08 hoopyfroody

Still doesn't work with new slot syntax ...

In 2.6.0, we introduced a new unified syntax (the v-slot directive) for named and scoped slots. It replaces the slot and slot-scope attributes, which are now deprecated, but have not been removed and are still documented here. The rationale for introducing the new syntax is described in this RFC.

    <Popper trigger="clickToToggle" :options="{ placement: 'top' }">
      <BaseButton @click="toggleMenu" slot="reference">
        <template v-slot:icon>
          <ChecIcon :icon="isOpen ? 'up' : 'down'" />
        </template>
      </BaseButton>
      <BasePopover
        @option-selected="handleSelectOption"
      >
        <!--
          @slot Provide BaseOption instances here
        -->
        <slot />
      </BasePopover>
    </Popper>

john-raymon avatar Mar 17 '20 01:03 john-raymon

I believe this is due to the fact that elm is undefined on Vnodes with new slot syntax. See this closed issue and the links to comments by Evan etc. https://github.com/vuejs/vue/issues/10450#issuecomment-526106397. Vue-popper won't work with Vue 3 unless you're passing the reference as a prop instead of using the slot.

josh7weaver avatar Sep 08 '20 15:09 josh7weaver

I've rewritten the component completly in vue 3.0 composition api style, it works with the new scoped slots (v-slot) directive. I won't send a PR because i don't care about backwards compatibility. If you want a copy, let me know.

SherinBloemendaal avatar Jan 12 '21 12:01 SherinBloemendaal

I've rewritten the component completly in vue 3.0 composition api style, it works with the new scoped slots (v-slot) directive. I won't send a PR because i don't care about backwards compatibility. If you want a copy, let me know.

I'd love to see this and have it available via npm to use.

nathanchase avatar Sep 06 '21 00:09 nathanchase

Hello,

I'm facing the same issue.

Any news about a fix ?

Thanks in advance.

meeds avatar Mar 22 '22 15:03 meeds