vue2中怎么动态引入组件

在Vue2中，可以通过异步组件和`import()`函数来实现动态引入组件。具体步骤如下：

1. 在Vue组件中，使用`Vue.component()`方法或`components`对象定义组件。
2. 在需要动态引入组件的地方，使用`import()`函数异步加载组件。
3. 在异步加载组件的回调函数中，使用`Vue.component()`方法或`components`对象注册组件。
4. 在Vue实例中，通过修改变量的值来触发异步加载组件。

示例代码如下：

// 在 Vue 组件中定义组件
const ComponentA = {
  template: '<div>Component A</div>',
};
Vue.component('ComponentA', ComponentA);

// 在需要动态引入组件的地方，使用 import() 函数异步加载组件
function loadComponentB(callback) {
  import('./ComponentB.vue')
    .then((module) => {
      // 在异步加载组件的回调函数中注册组件
      Vue.component('ComponentB', module.default);
      callback();
    })
    .catch((error) => {
      console.error(error);
    });
}

// 在 Vue 实例中，通过修改变量的值来触发异步加载组件
new Vue({
  el: '#app',
  data() {
    return {
      currentComponent: 'ComponentA',
    };
  },
  methods: {
    toggleComponent() {
      if (this.currentComponent === 'ComponentA') {
        loadComponentB(() => {
          this.currentComponent = 'ComponentB';
        });
      } else {
        this.currentComponent = 'ComponentA';
      }
    },
  },
});

在上述示例中，当点击某个按钮时，会触发`toggleComponent`方法，从而触发异步加载组件。在异步加载组件的回调函数中，注册组件并修改`currentComponent`的值，从而动态改变引入的组件。