Improve example

PeachScript · PeachScript · commit 78b8ee61add4 · 2017-03-09T23:56:17.000+08:00
diff --git a/example/index.html b/example/index.html
@@ -19,15 +19,15 @@
       border-top: 1px solid #fff;
       border-bottom: 1px solid #e3e3e3;
     }
-    .example-list-item:before{
+    .example-list-item::before{
       content: 'Line: ';
     }
   </style>
 </head>
 <body>
   <div id="app">
     <p class="example-list-item" v-for="item in list" v-text="item"></p>
-    <infinite-loading :on-infinite="onInfinite" :distance="distance" v-if="list.length < 300"></infinite-loading>
+    <infinite-loading :on-infinite="onInfinite" :distance="distance"></infinite-loading>
   </div>
   <script>
     new Vue({
@@ -38,15 +38,19 @@
       },
       methods: {
         onInfinite: function () {
-          setTimeout(function () {
-            var temp = [];
-            for (var i = this.list.length; i <= this.list.length + 10; i++) {
-              temp.push(i);
-            }
+          if (this.list.length > 200) {
+            this.$broadcast('$InfiniteLoading:complete');
+          } else {
+            setTimeout(function () {
+              var temp = [];
+              for (var i = this.list.length; i <= this.list.length + 10; i++) {
+                temp.push(i);
+              }
 
-            this.list = this.list.concat(temp);
-            this.$broadcast('$InfiniteLoading:loaded');
-          }.bind(this), 1000);
+              this.list = this.list.concat(temp);
+              this.$broadcast('$InfiniteLoading:loaded');
+            }.bind(this), 1000);
+          }
         }
       }
     });
