vue项目模拟后台数据

这次我们来模拟一些后台数据，然后去请求它并且将其渲染到界面上。关于项目的搭建鄙人斗胆向大家推荐我的一篇随笔《Vue开发环境搭建及热更新》

我这里为了演示这个过程所以自己编写了这个data.json文件

 1 {
 2     "school":{
 3         "students":[
 4         {
 5             "name":"方毅",
 6             "sex":"男",
 7             "age":21,
 8             "class":1,
 9             "Chinese":100,
10             "Math":90,
11             "English":88,
12             "TotalPoint":278        
13         },
14         {
15             "name":"黎倩",
16             "sex":"女",
17             "age":20,
18             "class":1,
19             "Chinese":98,
20             "Math":80,
21             "English":75,
22             "TotalPoint":253        
23         },
24         {
25             "name":"陈二",
26             "sex":"男",
27             "age":22,
28             "class":2,
29             "Chinese":70,
30             "Math":60,
31             "English":50,
32             "TotalPoint":180        
33         },
34         {
35             "name":"邓珊",
36             "sex":"女",
37             "age":22,
38             "class":2,
39             "Chinese":72,
40             "Math":68,
41             "English":90,
42             "TotalPoint":230        
43         },
44         {
45             "name":"李四",
46             "sex":"男",
47             "age":23,
48             "class":3,
49             "Chinese":88,
50             "Math":72,
51             "English":90,
52             "TotalPoint":250        
53         },
54         {
55             "name":"何武",
56             "sex":"男",
57             "age":20,
58             "class":3,
59             "Chinese":75,
60             "Math":80,
61             "English":60,
62             "TotalPoint":215        
63         },
64         {
65             "name":"冯柳",
66             "sex":"女",
67             "age":20,
68             "class":4,
69             "Chinese":100,
70             "Math":99,
71             "English":88,
72             "TotalPoint":287        
73         }],
74         "teacher":[
75             {
76                 "class":1,
77                 "name":"Miss Lee"
78             },
79             {
80                 "class":2,
81                 "name":"Miss Gao"
82             },
83             {
84                 "class":3,
85                 "name":"Mr Fang"
86             },
87             {
88                 "class":4,
89                 "name":"Miss wu"
90             }
91         ]
92     }
93 }

data.json