1.项目的结构目录如下:
2.项目的主入口文件main.js 引入axios以及路由模块
3.App.vue
4.其余各组件
主页home
列表页list
购物车页cart
我的页main
mian当中使用的两个组件one和two
load加载页
详情页listDetail
一个案例中并为未用到的页面listitem
404页
5.路由配置
实现手段:在列表页首先使用axios来发送了get请求,在prams里面配置好参数,发送给给后台,获取数据,然后将数据遍历显示在list.vue中,以一种编程式传参的方式实现在列表页点击列表选项,将该项的详情显示在详情页,并且切换路由跳转到对应的页面上。(更改路由的同时,实现数据的传递)
6.效果: