首页 终身学习

本教程在上一篇Vue router使用方法的基础上进行

Vue router使用方法

1、在components文件夹中新建三个组件Text1、Text2、Text3
在这里插入图片描述
2、在router.js中引入组件

import Text1 from './components/Text1'
import Text2 from './components/Text2'
import Text3 from './components/Text3'

3、在routes内嵌套children

children: [{
                    path: '/',
                    redirect: 'text1'
                },
                {
                    path: 'text1',
                    component: Text1
                },
                {
                    path: 'text2',
                    component: Text2
                },
                {
                    path: 'text3',
                    component: Text3
                },
            ]

在这里插入图片描述
4、打开浏览器即可显示
在这里插入图片描述




文章评论