loading 配置

nuxt.config.js

// 定义系统默认loading效果，或者指定一个loading组件
  // 默认
  // loading: {color: '#399'},

系统默认

image.png

自定义loading

 // 自定义
  loading: '~/components/loading.vue', // 指向loading组件

loading.vue

<template>
  <div v-show='loading'>loading...</div>
</template>

<script>
export default {
  name: 'loading',
  data() {
    return {
      loading: false
    }
  },
  methods: {
    // nuxt 约定好的
    start() {
      this.loading = true
    },
    finish() {
      this.loading = false
    }
  }
}
</script>

image.png