vue 远程js 组件加载_Vue.js的另一个顶级进度加载栏组件

vue 远程js 组件加载

先进的进程 (vue-top-progress)

Yet another top progress loading bar component for Vue.js.

Vue.js的另一个顶级进度加载栏组件。

View demo 查看演示 Download Source 下载源

安装 (Installation)

$ npm install vue-top-progress

用法 (Usage)

<template>
  <vue-topprogress ref="topProgress"></vue-topprogress>
</template>

<script>
import vueTopprogress from 'vue-top-progress'

Vue.use(vueTopprogress)

// or

import { vueTopprogress } from 'vue-top-progress'

export default {
  mounted () {
    this.$refs.topProgress.start()

    // Use setTimeout for demo
    setTimeout(() => {
      this.$refs.topProgress.done()
    }, 2000)
  },

  components: {
    vueTopprogress
  }
}
</script>

道具 (Props)

speed

speed

Transition speed, in ms. Default: 350

转换速度，以毫秒为单位。 默认值： 350

easing

easing

Transition function. Default: linear

过渡功能。 默认值： linear

color

color

Color of progress bar. Default: #29d

进度条的颜色。 默认值： #29d

colorShadow

colorShadow

Shadow of progress bar. If omitted, will use progress bar color.

进度条的阴影。 如果省略，将使用进度条颜色。

errorColor

errorColor

Color of progress bar when status is error. Default: #f44336

状态错误时进度条的颜色。 默认值： #f44336

height

height

Height of progress bar. Default: 3

进度栏的高度。 默认值： 3

trickle

trickle

Turn off the automatic incrementing behavior by setting this to false. Default: true

通过将其设置为false来关闭自动递增行为。 默认值： true

trickleSpeed

trickleSpeed

How often to trickle, in ms. Default: 250

滴流的频率，以毫秒为单位。 默认值： 250

minimum

minimum

Minimum percentage used upon starting. Default: 0.8

启动时使用的最小百分比。 默认值： 0.8

maximum

maximum

By default behavior, when progress start, it will never get to 100% until done or fail to be called. Setting this to adjust maximum percentage. Default: 97.5

默认情况下，进度开始时，直到done或fail调用，它永远不会达到100％。 设置此项可调整最大百分比。 默认值： 97.5

zIndex

zIndex

The z-index of component. Default: 9999

组件的Z索引。 默认值： 9999

翻译自: https://vuejsexamples.com/yet-another-top-progress-loading-bar-component-for-vue-js/

vue 远程js 组件加载