商品列表组件化开发
header组件
footer组件
面包屑组件
如图所示，是四种创建Vue的实例
我们在
第一章开篇已经介绍了项目的搭建了现在，我们简单的介绍一下项目目录
如图所示assets和static放的都是静态的资源，一般组件的样式图片什么的都放在assets文件夹里面，static放的是页面要用到的资源，组件和页面的文件，component放的是组件的文件，view放的页面的文件。assets文件会生成base64位，static只是src的路径引入文件
定义路由
首先第一步安装路由npm i vue-router --save
或者在你使用vue-cli脚手架工具的时候就已经安装了vue-router直接使用就可以了
第一步 在src文件下定义router文件夹，作为路由跳转的文件的存储，这里我们建立index.js
index.js
说明：文件中要引入vue和vue-router
使用Vue.use(Router)
创建router实例
在直接导出有两种写法
第一种
export default new Router({
routes:[
{
path:'/',
component:GoodsList
}
]
})
第二种写法
生成一个变量将其进行封装
const routes=[
path:'/',
component:'GoodsList'
]
var router=new Router({
routes
})
export default router
最后一步在main.js中注入路由就可以了
也可以写成router：router
直接在App.VUE里面设置<router-view></router-view>就可以了
