如何用Vue代码实现按需加载

Vue提供了一种异步组件的方式来实现按需加载,即当组件需要时才异步加载它们。

// 定义一个异步组件
const AsyncComp = () => ({
  // 需要加载的组件(应该是一个 `Promise` 对象)
  component: import('./MyComp.vue'),
  // 加载中应该渲染的组件
  loading: LoadingComp,
  // 出错时渲染的组件
  error: ErrorComp,
  // 渲染 loading 组件前的等待时间。默认:200ms.
  delay: 200,
  // 最长等待时间。超出此时间则渲染错误组件。默认:Infinity
  timeout: 3000
})

// 在组件中使用
const Comp = {
  components: {
    AsyncComp
  }
}
© 版权声明
THE END
喜欢就支持一下吧
点赞13 分享