[Component Problem] Modal

[Johan15111]

I am trying to use the Modal component, I have the following in my vue file:

<div>
    <base-button type="primary" @click="modals.modal0 = true">
      Launch demo modal
    </base-button>
   <modal :show.sync="modals.modal0">
     <template slot="header">
        <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
     </template>
     <div>
      ...
     </div>
     <template slot="footer">
         <base-button type="secondary" @click="modals.modal0 = false">Close</base-button>
         <base-button type="primary">Save changes</base-button>
     </template>
   </modal>

</div>

And in the export default:

...
import Modal from "@/components/Modal";
import Modals from "@/views/components/JavascriptComponents/Modals.vue";
...
components: {
        Modal,
        Modals
    },
...

However, the component does not load and I get the following error in console: Property or method "modals" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.

[github-actions[bot]]

@Johan15111 this issue was automatically closed because it did not follow the bellow rules:

IMPORTANT: Please use the following link to create a new issue:

https://www.creative-tim.com/new-issue/vue-argon-design-system

**If your issue was not created using the app above, it will be closed immediately.**

Love Creative Tim? Do you need Angular, React, Vuejs or HTML? You can visit:
👉  https://www.creative-tim.com/bundles
👉  https://www.creative-tim.com