feat: optimize example

Author: staticdeng

example/src/App.vue

@@ -1,15 +1,21 @@
 <template>
-  <div class="wrap">
-    <vue-loadmore 
-      :on-refresh="onRefresh" 
-      :on-loadmore="onLoad"
-      :finished="finished"
-      :error.sync="error"
-    >
-      <ul class="list-ul">
-        <li class="list-li" v-for="(item, index) of list" :key="item">测试数据{{ index + 1 }}</li>
-      </ul>
-    </vue-loadmore>
+  <div>
+    <div class="loadmore-head">
+      <div class="text">{{ language === 'Chinese' ? '下拉刷新上拉加载' : 'pull up and pull down' }}</div>
+      <div class="lan" @click="changeLanguage">{{ language === 'Chinese' ? 'English' : 'Chinese' }}</div>
+    </div>
+    <div class="wrap">
+      <vue-loadmore 
+        :on-refresh="onRefresh" 
+        :on-loadmore="onLoad"
+        :finished="finished"
+        :error.sync="error"
+      >
+        <ul class="list-ul">
+          <li class="list-li" v-for="(item, index) of list" :key="item">{{ language === 'Chinese' ? '测试数据' : 'This is data' }} {{ index + 1 }}</li>
+        </ul>
+      </vue-loadmore>
+    </div>
   </div>
 </template>
 
@@ -27,6 +33,7 @@ export default {
       loading: false,
       finished: false,
       error: false,
+      language: 'Chinese'
     };
   },
   methods: {
@@ -48,6 +55,9 @@ export default {
       }
       
       done();
+    },
+    changeLanguage() {
+      this.language = this.language === 'Chinese' ? 'English' : 'Chinese';
     }
   },
   destroyed() {
@@ -60,10 +70,38 @@ export default {
 @import './assets/reset';
 .wrap{
   padding: 20px;
+  margin-top: 25px;
   // margin-top: 100px;
   // overflow: auto;
   // height: 500px;
 }
+.loadmore-head {
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+  background: #fff;
+  overflow: hidden;
+  min-width: 30px;
+  height: 45px;
+  text-align: center;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  box-shadow: 0 0 10px rgba(0,0,0,.05);
+  z-index: 2;
+  .text {
+    font-size: 17px;
+    font-weight: 500;
+    line-height: 45px;
+  }
+  .lan {
+    position: absolute;
+    right: 12px;
+    bottom: 10px;
+    font-size: 14px;
+    cursor: pointer;
+  }
+}
 .list-ul {
   .list-li {
     height: 50px;