From 401f0f3689c370ea89a2f5082aa04ca33bd1f659 Mon Sep 17 00:00:00 2001
From: ljj <990328915@qq.com>
Date: Sun, 5 May 2024 15:28:48 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0Mock=E4=BD=9C=E4=B8=BA?=
 =?UTF-8?q?=E8=99=9A=E6=8B=9F=E6=B5=8B=E8=AF=95=E6=95=B0=E6=8D=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue | 27 +++++++++------------------
 src/main.js |  1 +
 src/mock.js | 21 +++++++++++++++++++++
 3 files changed, 31 insertions(+), 18 deletions(-)
 create mode 100644 src/mock.js

diff --git a/src/App.vue b/src/App.vue
index 591a031..5c86d2d 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,26 +1,17 @@
+// App.vue
+
 <template>
-  <img alt="Vue logo" src="./assets/logo.png">
-  <HelloWorld msg="Welcome to Your Vue.js App"/>
+  <div id="#app"></div>
 </template>
 
 <script>
-import HelloWorld from './components/HelloWorld.vue'
-
+import axios from 'axios' // 引入axios
 export default {
-  name: 'App',
-  components: {
-    HelloWorld
+  // 挂载的时候获取新闻列表
+  mounted() {
+    axios.get('/mock/news').then(res => { // url即在mock.js中定义的
+      console.log(res.data) // 打印一下响应数据
+    })
   }
 }
 </script>
-
-<style>
-#app {
-  font-family: Avenir, Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  text-align: center;
-  color: #2c3e50;
-  margin-top: 60px;
-}
-</style>
diff --git a/src/main.js b/src/main.js
index 01433bc..1417c3f 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,4 +1,5 @@
 import { createApp } from 'vue'
 import App from './App.vue'
+require('./mock')
 
 createApp(App).mount('#app')
diff --git a/src/mock.js b/src/mock.js
new file mode 100644
index 0000000..26cf8b4
--- /dev/null
+++ b/src/mock.js
@@ -0,0 +1,21 @@
+// mock.js
+
+// 引入mockjs
+const Mock = require('mockjs')
+// 获取 mock.Random 对象
+const Random = Mock.Random
+// mock新闻数据，包括新闻标题title、内容content、创建时间createdTime
+const produceNewsData = function () {
+    let newsList = []
+    for (let i = 0; i < 20; i++) {
+        let newNewsObject = {
+            title: Random.ctitle(), // Random.ctitle( min, max ) 随机产生一个中文标题，长度默认在3-7之间
+            content: Random.cparagraph(), // Random.cparagraph(min, max) 随机生成一个中文段落，段落里的句子个数默认3-7个
+            createdTime: Random.date() // Random.date()指示生成的日期字符串的格式,默认为yyyy-MM-dd；
+        }
+        newsList.push(newNewsObject)
+    }
+    return newsList
+}
+// 请求该url，就可以返回newsList
+Mock.mock('/mock/news', produceNewsData) // 后面讲这个api的使用细节