未验证 提交 d995cdb3 编写于 作者: 花裤衩 提交者: GitHub

add[example]: add nested routes example (#789)

上级 cbc3ddd8
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1529559567446" class="icon" style="" viewBox="0 0 1167 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1767" xmlns:xlink="http://www.w3.org/1999/xlink" width="227.9296875" height="200"><defs><style type="text/css"></style></defs><path d="M0.015952 74.459413A2.286 2.286 1440 1 0 145.85218 74.459413 2.286 2.286 1440 1 0 0.015952 74.459413zM291.720312 1.525347 1166.801488 1.525347 1166.801488 147.361574 291.720312 147.361574zM291.720312 366.163773A2.286 2.286 1440 1 0 437.55654 366.163773 2.286 2.286 1440 1 0 291.720312 366.163773zM583.424672 293.229707 1166.801488 293.229707 1166.801488 439.065934 583.424672 439.065934zM291.720312 949.540588A2.286 2.286 1440 1 0 437.55654 949.540588 2.286 2.286 1440 1 0 291.720312 949.540588zM583.424672 876.638427 1166.801488 876.638427 1166.801488 1022.474654 583.424672 1022.474654zM583.424672 657.836228A2.286 2.286 1440 1 0 729.2609 657.836228 2.286 2.286 1440 1 0 583.424672 657.836228zM875.129032 584.934067 1166.801488 584.934067 1166.801488 730.770294 875.129032 730.770294z" p-id="1768"></path></svg>
\ No newline at end of file
......@@ -28,6 +28,10 @@ export default {
lineChart: 'Line Chart',
mixChart: 'Mix Chart',
example: 'Example',
nested: 'Nested Routes',
bar: 'Bar',
barProfile: 'Profile',
barPosts: 'Posts',
Table: 'Table',
dynamicTable: 'Dynamic Table',
dragTable: 'Drag Table',
......
......@@ -28,6 +28,10 @@ export default {
lineChart: '折线图',
mixChart: '混合图表',
example: '综合实例',
nested: '路由嵌套',
bar: 'Bar',
barProfile: 'Profile',
barPosts: 'Posts',
Table: 'Table',
dynamicTable: '动态Table',
dragTable: '拖拽Table',
......
......@@ -199,6 +199,39 @@ export const asyncRouterMap = [
]
},
{
path: '/nested',
component: Layout,
redirect: '/nested/bar/profile',
name: 'nested',
meta: {
title: 'nested',
icon: 'nested'
},
children: [
{
path: '/nested/bar', // Must write the full path
component: () => import('@/views/nested/bar/index'), // Parent router-view
name: 'bar',
meta: { title: 'bar' },
children: [
{
path: 'profile',
component: () => import('@/views/nested/bar/profile'),
name: 'bar-profile',
meta: { title: 'barProfile' }
},
{
path: 'posts',
component: () => import('@/views/nested/bar/posts'),
name: 'bar-posts',
meta: { title: 'barPosts' }
}
]
}
]
},
{
path: '/error',
component: Layout,
......
<template>
<div class="app-container">
<code>Parent View: Bar</code>
<img src="https://wpimg.wallstcn.com/be29a7d2-5ccf-4a2b-888d-8a6c2bbb7aac.png">
<router-view></router-view>
</div>
</template>
<template>
<div style="margin-top:30px;">
<el-alert title="Children: Posts" type="warning" :closable="false">
</el-alert>
</div>
</template>
<template>
<div style="margin-top:30px;">
<el-alert title="Children: Profile" type="success" :closable="false">
</el-alert>
</div>
</template>
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册