loading indicator プロパティ

SPA のページ読み込み中に素敵なローディングインジケータを表示します!

Nuxt.js を SPA モードで実行した場合、最初のページ読み込み時にはサーバーサイドからのコンテンツがありません。そのためページ読み込み中に空白のページのかわりにスピナーを表示することができます。

このプロパティには stringfalseobject の 3 つの異なる型を指定できます。文字列が指定された場合はオブジェクトスタイルに変換されます。

デフォルト値:

loadingIndicator: {
  name: 'circle',
  color: '#3B8070',
  background: 'white'
}

内蔵されているインジケータ

これらのインジケータは素晴らしい Spinkit プロジェクトからインポートされています。Spinkit のデモページを使ってスピナーをプレビューできます。

  • circle
  • cube-grid
  • fading-circle
  • folding-cube
  • chasing-dots
  • nuxt
  • pulse
  • rectangle-bounce
  • rotating-plane
  • three-bounce
  • wandering-cubes

内臓インジケータは colorbackground オプションをサポートしています。

独自のインジケータ

独自の特別なインジケータが必要な場合は文字列または Name キーをインジケータのソースコードの html テンプレートへのパスにすることもできます。すべてのオプションもテンプレートに渡されます。

もしベースが必要な場合はソースコードも利用できます!

Contributors

間違いを見つけた、またはドキュメントに貢献したいですか? GitHub でこのページを編集する