JS 和 Vue.js 中的动态导入

Question

我正在使用 Vue.js 框架编写一个 Web 应用程序。需要使用动态导入。您需要使用参数及其名称进行导入，然后定义生成的组件。  js中动态导入的语法如下：  async () => {      const module_path = 'module_path';      const module = await import(module_path)      module.default();    }  因此，只能在异步函数内使用动态导入的库。我需要在其他地方使用导入的组件：  <template>     <div>        <!-- imported component definition -->        <component v-bind:is="my_component"></component>     </div>  </template>  <script>     # Here you need to dynamically import the component, so that you      # can define it later on line 3.     # How to make a static import is clear (shown below). But I need a      # dynamic one.     import my_component from "./component_title.Vue"          export default {        props: () -> {           # The name of the component to be imported.           # Transferred from another component.           component_title: {type: String, default: null}        }        components: {           # The component is declared           my_component: my_component        }     }  </script>  这个任务可以实现动态导入吗？

Answer 1

是的。import()只需在您的组件中使用：

components: { 
  my_component: () => import(path)
}