在vscode终端中安装路由

ps：此处代码div中和import······以及data中的Content是引用的自己组件，可以不写，如果有组件请换成自己的了路径(关于vue组件的引用请看上一篇文章)

路径要写对，名字要写对如果路由很多，默认指向可以更改

在要更改的页面引用路由

将要切换的页面封装成组件

使用 children 属性，实现子路由，同时，子路由的 path 前面，不要带 / ，

否则永远以根路径开始请求，这样不方便我们用户去理解URL地址

VueRouter系列的文章示例编写时，项目是使用vue-cli脚手架搭建。

项目搭建的步骤和项目目录专门写了一篇文章：

后续VueRouter系列的文章的示例编写均基于该项目环境。

　　《VueRouter爬坑第二篇》-动态路由

　　《VueRouter爬坑第三篇》-嵌套路由

 本篇文章完整代码请移步：

 

 2.为组件设置URL,通过url可以动态的加载组件
 


 

];//定义一个常量来将url和组件绑定起来

 

 4.配置连接的出口,实现动态的加载组件
 


 

 

 
 


 

 现在,可以通过url动态加载我们的组件
 


 

 
 


 

 
 


 

 5.将连接入口,挂载到网页上
 


 

 

 
 


 

 可以通过点击商品和评论完成页面局部的刷新
 


 

 
 


 

 
 


 

 


 

 


 

 以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。