[Vuejs]-How do I import a Vue component into Vue and substitute a value?

by

0👍

✅

You can pass data to Vue components a few different ways. In your case its probably easiest to add a property to the component.

<template>
      <div id="app">
        <my-counter v-bind:count='myNum></my-counter>
      </div>
    </template>

    <script>
    import myCounter from './components/template.vue'

    export default {
      name: 'app',
      components: { myCounter },

      data: {
        myNum: 5
      }
    }

    </script>

And in the child:

<template>
  <div v-if="product.id === count">
</template>

<script>

export default {
  name: 'myComponent',
  props: {
    count: Number,
    // notice this is the same as the property passed in
    // value is the type to expect, Number, String, Object, etc
  }
}

</script>

Leave a comment