<div slot="spinner">読込中</div>
<div slot="no-more">全件取得しました</div>
<div slot="no-results">データがありません</div>
<div slot="spinner">
</div>
#これ毎回コンポーネントにかくのだるくね?
だるいだるいだるい!!!!!
##やったこと
公式ドキュメントを読んだ。
https://peachscript.github.io/vue-infinite-loading/
英語と中国語 💢
##解決策
import Vue from 'vue'
import InfiniteLoading from 'vue-infinite-loading'
Vue.use(InfiniteLoading, {
slots: {
spinner: "データないです",
noMore: 'もうないです。',
noResults: "データがない",
},
});
おそらくInfinitive loadを入れる際にプラグイン?として任意のフォルダにjsファイルを入れているかと思います。(忘れている人は思いだして。)
そこに共通の設定が書けるようになっていました。なんて便利なんだ!
注意点として変数?として"-"が使えないようなので?キャメルケースでの記述に変換するようです。
no-more -> noMore
no-results -> noResults
<div slot="no-more">全件取得しました</div>
↓こんな感じかな。
noMore: '全件取得しました。',
##結論
開発がんばろう。!!!!!!!!!!!!!!!