0

I have a component called Card.vue that is duplicated many times. So there is not one instance of the component. Should I still be using el to link the element with the component? Ie should I be doing the following or something else?

<template>
  <div class="card">
    ...
  </div>
</template>

<script>
export default {
  el: '.card', // should I use another property (list?) or something else?
}
</script>

<style lang="scss">

</style>
sazr
  • 24,984
  • 66
  • 194
  • 362

1 Answers1

1

el is used for a top-level Vue instance to indicate where the instance should be inserted.

You should not generally be providing an el to components. They are typically inserted using custom tags within a parent's template. See the docs for some examples as well as general information.

A parent object using your component might have code like

<Card></Card>

to insert the component. Although you should really use a safe custom tag (primarily meaning it should have a hyphen) for your component.

tony19
  • 125,647
  • 18
  • 229
  • 307
Roy J
  • 42,522
  • 10
  • 78
  • 102
  • thanks, I need to call a js function on each card (each is a mini slider/carousel). So I need to call `$('.card').flickity()`. How would either the card component or the parent component call that function? – sazr Apr 10 '18 at 14:54
  • 1
    `this.$el.flickity()` – Roy J Apr 10 '18 at 15:10