当前位置:首页 > 技术分析 > 正文内容

41、Vue-router 怎么配置路由(必会)

ruisui883个月前 (02-03)技术分析10

在 vue 中配置路由分为 5 个步骤,分别是:

1、安装

npm install --save vue-router

2、引用

import VueRouter from 'vue-router'

3、配置路由文件

var router = new VueRouter({

routes:[

{

path:"/hello",

component:HelloWorld

},

{

path:"/wen",

component:HelloWen

new Vue({

el: '#app',

components: { App },

router,

template: ''

})

4、视图加载的位置

默认 App.vue 文件中加

5、跳转导航

helloword(渲染出来的是 a 标签)

扫描二维码推送至手机访问。

版权声明:本文由ruisui88发布,如需转载请注明出处。

本文链接:http://www.ruisui88.com/post/809.html

分享给朋友:

“41、Vue-router 怎么配置路由(必会)” 的相关文章

智慧校园平台解决方案-收费管理系统

收费管理系统简介:学生收费管理系统与教务系统,学工系统实现数据互通;实现网站支付功能,实现学生在家,在宿舍,只要能够上网即可通过支付宝,微信,网银对产生的订单进行支付。服务网大厅中的web网上查询使得数据查询更加便利,财务负责人通过平台查看学生收费情况,院系老师通过查询平台查询本院系实时收费情况等,...

vue:组件中之间的传值

一、父子组件之间的传值----props/$emit1、父组件向子组件传值--props2.子组件想父组件传值-this.$emit('select',item)二、父组件向下(深层)子组件传值----provide/injectprovide:Object | () => O...

vue中如何在自定义组件上使用v-model和.sync

自定义事件tips推荐始终使用 kebab-case 的事件名。(v-on会将事件名自动转换为小写,避免匹配不到)changeData ×change-data √自定义组件的v-model用法:父组件定义数据源(不需要定义修改数据的方法),在子组件标签上通过v-model="data...

Git 分支管理策略与工作流程

(预警:因为详细,所以行文有些长,新手边看边操作效果出乎你的预料)团队开发中,遵循一个合理、清晰的Git使用流程,是非常重要的。否则,每个人都提交一堆杂乱无章的commit,项目很快就会变得难以协调和维护。看完这篇文章后,涉及GIT的工作中就会减少因为规范问题导致工作出错,当然如果你现在暂时还未有合...

用IDEA开发如何用Git快速拉取指定分支代码?

1,准备空的文件夹,git init2,关联远程仓库,git remote add origin gitlab地址3,拉取远程分支代码,git pull origin 远程分支名再用IDEA打开项目即可...

迁移GIT仓库并带有历史提交记录

迁移git仓库开发在很多时候,会遇到一个问题。GIT仓库的管理,特别是仓库的迁移。我需要保留已有的历史记录,而不是重新开发,重头再来。我们可以这样做:使用--mirror模式会把本地的分支都克隆。// 先用--bare克隆裸仓库 git clone git@gitee.com:xxx/testApp...