smastrom / vue-collapsed

🏋️‍♂️ CSS height transition from any to auto and vice versa for Vue and Nuxt. Accordion ready.
https://vue-collapsed.pages.dev
MIT License
123 stars 8 forks source link

use vue's events instead of binding callbacks #9

Closed Alexnortung closed 1 year ago

Alexnortung commented 1 year ago

instead of having to bind the callbacks with props, why not just use vue's own emits? So this:

    <Collapse
      :when="selected"
      :onExpanded="() => scrollIntoView(index)"
      class="v-collapse"
    >
      <p>
        Hello world
      </p>
    </Collapse>

would become this:

    <Collapse
      :when="selected"
      @expanded="() => scrollIntoView(index)"
      class="v-collapse"
    >
      <p>
        Hello world
      </p>
    </Collapse>

This seems more intuitive when working with vue (at least to me).

smastrom-dolly commented 1 year ago

Hi @Alexnortung, I can totally understand that events feels more natural for some people, I choose the 'prop' approach because (at least for me) they integrate better with the IDE (autocomplete, type definition) but also because they're nothing else than a callback passed from the parent to child. Collapse is actually not exposing any data to the parent, the callback is just a () => void function that Collapse receives and executes at some point.

However, we might integrate them (but without removing the props), feel free to submit a PR and I'll merge it and update the README accordingly.

Have a nice day!