导入异步组件，命名为Vue.js

Question

我知道如何在Vue中加载异步组件。这

import MyComponent from '@/components/MyComponent'

export default {
  components: {
    MyComponent
  }
}

被替换为

export default {
  components: {
    MyComponent: () => import('@/components/MyComponent')
  }
}

但是我怎样才能像这样替换“命名的”组件导入呢？

import { SweetModal } from 'sweet-modal-vue'

export default {
  components: {
    SweetModal
  }
}

如何异步导入？

Answer 1

您可以以相同的方式使用，但要获取特定的组件：

export default {
  components: {
    SweetModal: () => import('sweet-modal-vue').then(m => m.SweetModal)
  }
}

我建议你阅读这篇文章：Async Vue.js Component