<NuxtLoadingIndicator>
在页面导航之间显示进度条。
用法
在你的 app.vue 或 layouts/ 中添加 <NuxtLoadingIndicator/>。
app.vue
<template>
<NuxtLoadingIndicator />
<NuxtLayout>
<NuxtPage />
</NuxtLayout>
</template>
在 文档 > 示例 > 路由 > 页面 中阅读和编辑一个实时示例。
插槽
您可以通过加载指示器的默认插槽传递自定义 HTML 或组件。
属性
color：加载条的颜色。可以设置为false以关闭显式颜色样式。errorColor：当error设置为true时加载条的颜色。height：加载条的高度，以像素为单位（默认值为3）。duration：加载条的持续时间，以毫秒为单位（默认值为2000）。throttle：以毫秒为单位控制加载条的显示和隐藏（默认值为200）。estimatedProgress：默认情况下，Nuxt 在接近 100% 时会后退。您可以提供一个自定义函数来自定义进度估计，该函数接收加载条的持续时间（如上）和经过的时间。它应该返回 0 到 100 之间的值。
此组件是可选的。
要实现完全自定义，您可以根据 其源代码 实现自己的自定义组件。
要实现完全自定义，您可以根据 其源代码 实现自己的自定义组件。
您可以使用
useLoadingIndicator 组合式函数 连接到底层指示器实例，这将允许您自己触发开始/结束事件。加载指示器的速度在达到由
estimatedProgress 控制的特定点后会逐渐降低。此调整更准确地反映了较长的页面加载时间，并防止指示器过早显示 100% 完成。