电商系统前后端开发(Vue+SSM)(12) - 路由

tech2025-07-31  17

1 路由

1.1 安装路由模块

1.2 创建静态路由表

1.3 在 main.js 使用路由模块以及绑定路由表

import Vue from 'vue' import App from './App.vue' import axios from 'axios' import VueAxios from "vue-axios" // 1.引入路由模块 import VueRouter from 'vue-router' // 2.引入静态路由表 import {routes} from './routes' // 3.使用路由模块 Vue.use(VueRouter) Vue.use(VueAxios, axios) // 4.创建一个 VueRouter 模块的实例 const router = new VueRouter({ routes: routes }) new Vue({ el: '#app', router, // 5.把router 实例放入到 vue 实例 // 让 App.vue 的内容展现在该 div 中 render: h => h(App) })

1.4 创建路由链接和路由视图

2 路由参数传递

2.1 设参

通过路由表设置参数

2.2 传参

2.3 接参

3 路由跳转的 2 种方式

4 Vue 组件 style 标签的 scoped 属性

5 Vue 静态资源打包

最新回复(0)