CODEWITHSUNDEEP
djangovue.js
imran
imran

Reputation: 1

Use Vue components in application at runtime

I am developing a small application using Vue which will have list of downloadable components available to the user. Downloadable components will be hosted somewhere on the webserver(compiled version of SFC's) seperately. List of components can be increased or decreased based on users permissions.

This application will be shared with the user to download the components of their choice and add them to the list.

Problem is am not getting any examples in the internet where compiled components are used inside compiled Vue apps at runtime.

All the available examples need compiled components to be registered or to be imported in the applications in order to use it.

The only way right now is to chuck the idea of using ES6 or (.vue) Single file Components luxury and use ES5 version which i don't want to. Can anyone help me out? Backend used is Django

Upvotes: 0

Views: 389

Answers (1)

Shabir Abdulmajeed
Shabir Abdulmajeed

Reputation: 11

Vue.Js provide a solution for this problem. You can use dynamic component/ Async components. For dynamic components you can use this

<keep-alive>
  <component v-bind:is="currentTabComponent"></component>
</keep-alive>

If you want to use async components then you can use

 Vue.component('async-example', function (resolve, reject) {
  setTimeout(function () {
    // Pass the component definition to the resolve callback
    resolve({
      template: '<div>I am async!</div>'
    })
  }, 1000)
})

For more details you can visit vue.Js documentation https://v2.vuejs.org/v2/guide/components-dynamic-async.html

Upvotes: 1

Related Questions