AI
推荐
模板社区
专题
登录
免费注册
首页
思维导图
详情
主面板配置
2021-04-02 10:13:27
11
举报
分享方式
免费使用
主面板配置
高效工作方式
资产管理
模板推荐
作者其他创作
大纲/内容
1. 引入路由
1. 下载vue-router
yarn add vue-router --save
2. 一级路由配置
router/index.js
1. 引入对应模块
import Vue from 'vue' import VueRouter from 'vue-router'
2. 声明使用
Vue.use(VueRouter)
3. 输出路由对象
export default new VueRouter({ // 所有路由 routes: [ ... ] })
4. main.js中使用路由
引入路由器
import router from './router/index'
配置
new Vue({ el: '#app', router, // 配置路由器 render: h => h(App) })
注意
1. 配置完成路由后, 会增加了几个组件 <router-link></router-link> 、<router-view></router-view>、<keep-alive></keep-alive>
2. 配置完成路由后, 增加了两个属性供访问使用: $router 、$route
5. App.vue中进行组件化
1. 引入
<script> // 1. 引入需要的组件 import TabBar from '../src/components/TabbBar/TabBar' export default { name: "App", components: { TabBar } } </script>
2. 实例
<template> <div> <!--路由组件--> <router-view></router-view> <!--底部选项卡--> <tab-bar></tab-bar> </div> </template>
3. 调试运行
切换url, 检查是否跳转
收藏
立即使用
异常报备及外呼流程
收藏
立即使用
项目搭建
收藏
立即使用
组件标准化
收藏
立即使用
分享服务
widestar_lt
职业：硕士
去主页
Collect
Get Started
IPMI配置
Collect
Get Started
追踪面板指引玩家完成指定任务流程
Collect
Get Started
追踪面板自动关闭和打开流程
Collect
Get Started
毕设_checkstyle配置
评论
0
条评论
下一页
图形选择
思维导图
主题
补充说明
AI生成
修改AI描述
去编辑
重新生成
提示
关闭后当前内容将不会保存，是否继续？
取消
确定
Document
