Vue中动态注入组件

源自https://juejin.im/post/5de1d7d25188252112798118

Mark留存

<template>
  <div class="home">
    <component :is="item.component" v-for="(item ,index) in componentList" :info="item" :key="index" />
  </div>
</template>
computed: {
      componentList() {
        let { list } = this
       return list.map(item => {
          item.component = () => {
            return new Promise((resolve, reject) => {
             import(`@/components/${item.type}`).then(res => {
                resolve(res)
              }).catch(() => {
                resolve(import('@/components/Error'))
              })
            })
          }
          return item
        })
      }
    }