[Vuejs]-Vue dynamic component template not working for promise

by

0👍

✅

Not sure why you’re seeing that error, as loader is clearly defined as a computed prop that returns a function.

However, the created hook seems to call loader() twice (the second call is unnecessary). That could be simplified:

export default {
  created() {
    // Option 1
    this.loader().then(res => this.myComponent = res)

    // Option 2
    this.myComponent = () => this.loader()
  }
}

demo 1

Even simpler would be to rename loader with myComponent, getting rid of the myComponent data property:

export default {
  //data() {
  //  return {
  //    myComponent: '',
  //  };
  //},

  computed: {
    //loader() {
    myComponent() {
      return () => import(`../components/${this.component}`);
    },
  },
}

demo 2

Leave a comment