Feat 所有包升级到最新版

src/App.vue

@@ -1,10 +1,10 @@
 <template>
     <div>
-        <!-- 可以删掉 顶部 -->
+        <!-- 删除试试 顶部 -->
         <HeaderCompontent></HeaderCompontent>
         <!-- 渲染出口 -->
         <router-view></router-view>
-        <!-- 可以删除 底部菜单 -->
+        <!-- 删除试试 底部菜单 -->
         <FootComponent></FootComponent>
     </div>
 </template>

src/mock/index.js

@@ -0,0 +1,17 @@
+// mock data
+export const data =  {
+    success: true,
+    data: [{
+        name: "React",
+        id: 1,
+    },{
+        name: "Vue",
+        id: 2,
+    },{
+        name: "Angular",
+        id: 3,
+    },{
+        name: "Flutter",
+        id: 4,
+    }]
+};

src/pages/index.vue

@@ -1,42 +1,35 @@
 <template>
   <div>
     <button v-on:click="loadMore">click me</button>
-    <div>
 	<ul>
 		<li v-for="(item, index) in listArr" :key="index">
 			<a href="">{{ index }} 《{{ item.name }}》</a>
 		</li>
 	</ul>
   </div>
-    <div class="loading" v-if="loading">
-      Loading...
-    </div>
-  </div>
 </template>
 <script>
+let mock = require('../mock'); // 模拟请求
+
 export default {
 	data: () => ({
-	loading: false,
 		listArr: [],
+		page: 1,
 	}),
 	created() {
 		this.loadList();
 	},
 	methods: {
-    loadList() {
+		loadList(page) {
-		let url = "https://api.github.com/search/code?q=addClass+in:file+language:js+repo:jquery/jquery";
+			const {data, success} = mock.data;
-		fetch(url, {
+			if (this.page > 1) {
-			method: "GET",
+				console.log("page is:", this.page);
-		}).then((res) => {
+				return this.listArr = this.listArr.concat(data);
-			const {data}  = res;
+			}
-			console.log(res);
+			this.listArr = data;
-			this.listArr = data.items;
-        })
-        .catch();
 		},
 		loadMore() {
-		console.log("load more");
+			this.loadList(this.page++);
-		this.loadList();
 		},
 	},
 };