codewithashish

create child component reference in vue

Ashish K's photo
Ashish K
·

1 min read

Most of the time we worked on vue js we need to create child component object to use it public methods/properties. We need to follow below steps. In our current scenario FileUploader is a child component

<FileUploader
      ref="fileUploader"
      :multiple="true"
      :config="config"
      @fileUploadEmitter="fileUploadHandler($event)"
      @filesEmitter="handleFiles($event)"
    />

Here we can see that we have added ref="fileUploader" in our html code snippets. In our vue script we just need to use below statement to use FileUploader class as an object.

this.$refs.fileUploader

We can use all the public methods/properties of the FileUploader class like:

this.$refs.fileUploader.methodFirst()
this.$refs.fileUploader.methodSecond()
Vue.js