异步组件

有些时候我们为了简化应用的内容,只在需要的时候才从服务器加载一个模块

Vue.component("async-example", function(resolve, reject) {
  setTimeout(function() {
    // 这里的异步也可以是请求一个html文件
    // 向 `resolve` 回调传递组件定义
    resolve({
      template: "<div>I am async!</div>"
    });
  }, 1000);
});

这里的可以在工厂函数中返回一个 Promise:

Vue.component(
  "async-webpack-example",
  // 这个 `import` 函数会返回一个 `Promise` 对象。
  () => import("./my-async-component")
);

当使用局部注册的时候,你也可以直接提供一个返回 Promise 的函数:

new Vue({
  // ...
  components: {
    "my-component": () => import("./my-async-component")
  }
});
Last Updated:
Contributors: zerojs