CLIを使わずVueアプリケーションを作っております。
vue-infinite-loadingを使い無限スクロール機能を実装をしたいと思っているのですが、うまくいきません。
vue-infinite-loading CDN
エラーの内容は、
InfiniteLoading is not defined
となり見つからないと怒られます。。。
初歩的なことでしら申し訳ありませんが、CDNで読み込む場合の方法をご教授ください。。。
コードは以下です。
html
1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4<!-- 中略 --> 5 <script src="/static/vue/vue-infinite-loading.js"></script> 6 <script src="/static/vue/vue.js"></script> 7 <script src="/static/vue/scripts/home.js"></script> 8</head> 9<body> 10 11 <!-- 中略 --> 12 <div id="contents" class="home" v-cloak> 13 14 <infinite-loading 15 @infinite="infiniteHandler"> 16 <div slot="no-results"/> 17 </infinite-loading> 18 <ul> 19 <!-- 中略 --> 20 </ul> 21 </div> 22</body> 23</html>
js
1// static/vue/scripts/home.js 2new Vue({ 3 el: '#contents', 4 data: { 5 //中略 6 }, 7 components: { 8 'infinite-loading': VueInfiniteLoading, 9 //中略 10 mounted: function () { 11 //中略 12 }, 13 watch: { 14 }, 15 computed: { 16 }, 17 methods: { 18 //中略 19 infiniteHandler($state) { 20 const _this = this; 21 console.log("aaa"); 22 // if (self.todos.length >= this.page) { 23 // todos.slice(this.page,this.page+10).filter(function(item){ 24 // self.todos.push(item); 25 // return item; 26 // }); 27 // this.page += 10; 28 // $state.loaded(); 29 // } else { 30 // $state.complete(); 31 // } 32 }, 33 } 34});
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/09/04 04:40
2019/09/04 04:45
2019/09/04 04:50
2019/09/04 05:01
2019/09/04 05:07 編集
2019/09/04 05:20
2019/09/04 05:38 編集