vue2动态异步加载组件

在 Vue 2 中，可以使用 `Vue.component()` 方法动态注册和加载组件，以实现动态异步加载组件的功能。下面是一个示例：

首先，创建一个异步加载组件的函数，例如 `loadComponent()`：

function loadComponent(componentName) {
  return () => import(`@/components/${componentName}.vue`);
}

然后，在需要动态加载组件的地方，使用 `Vue.component()` 方法注册组件，并将组件的 `component` 属性设置为异步加载函数：

Vue.component('dynamic-component', loadComponent('DynamicComponent'));

在上述示例中，假设你的组件文件位于 `src/components` 目录下，且组件名为 `DynamicComponent`。

最后，在 Vue 模板中使用动态组件标签：

<template>
  <div>
    <component :is="currentComponent"></component>
  </div>
</template>

在上述示例中，`currentComponent` 是一个变量，你可以根据需要在 Vue 实例中进行修改，从而动态切换加载的组件。

这样就实现了在 Vue 2 中动态异步加载组件的功能。请注意，异步加载组件会在需要时进行网络请求，因此可以有效地减小初始页面加载大小。