vue-router—5嵌套路由的使用

今天药忘吃喽~ 2022-01-21 10:43 290阅读 0赞

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2ppYW9qc3Vu_size_16_color_FFFFFF_t_70][]

about

<template>
      <div>
        关于我
        <hr>
        <ul class="nav">
          <router-link to="/about" exact tag="li">
            <a>study</a>
          </router-link>
          <router-link to="/about/work" tag="li">
            <a>work</a>
          </router-link>
          <router-link to="/about/hobby" tag="li">
            <a>hobby</a>
          </router-link>
        </ul>
        <hr>
        测试数据: {
       {test}}
        <router-view></router-view>
    
      </div>
    </template>

测试

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2ppYW9qc3Vu_size_16_color_FFFFFF_t_70 1][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2ppYW9qc3Vu_size_16_color_FFFFFF_t_70 2][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2ppYW9qc3Vu_size_16_color_FFFFFF_t_70]: /images/20220121/c22a4f5aa4e142ccb94ff790b609f256.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2ppYW9qc3Vu_size_16_color_FFFFFF_t_70 1]: /images/20220121/83c3d09891ea4c2ab7a48794ad160076.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2ppYW9qc3Vu_size_16_color_FFFFFF_t_70 2]: /images/20220121/3785b35d52dc4a449ce06bf54f69cdad.png

发表评论取消回复

表情：

评论列表（有 0 条评论，290人围观）

还没有评论，来说两句吧...

相关阅读

相关 VueRouter路由嵌套

1. 前言本小节我们介绍如何嵌套使用 VueRouter。嵌套路由在日常的开发中非常常见，如何定义和使用嵌套路由是本节的重点。同学们在学完本节课程之后需要自己多尝试配置

怼烎@/ 2024年03月30日 18:02/ 0 赞/ 147 阅读

相关 VueRouter路由传参

1. 前言本小节我们介绍 VueRouter 路由组件传参。包括 params 传参、query 传参的两种方式。路由传参的知识点非常重要，在日常开发中，我们经常会通过

Myth丶恋晨/ 2024年03月27日 08:47/ 0 赞/ 145 阅读

相关 Vuerouter路由

1. 前/后端路由 1. 后端路由 1. 一个url（uniform resource location）对应一个页面 2. 在页面地址跳转时，后台会根据url

梦里梦外;/ 2023年03月04日 09:17/ 0 赞/ 50 阅读

相关 vue 路由、嵌套路由、动态路由

简介路由就是一套映射规则，当url中的哈希值（\hash）改变时，路由会根据制定好的规则，展示对应的视图组件。 vue中的路由路径分为：相对路径（不带 ‘/’，会拼接

朴灿烈づ我的快乐病毒、/ 2022年10月29日 13:28/ 0 赞/ 446 阅读

相关嵌套路由

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></titl

╰半橙微兮°/ 2022年06月01日 00:23/ 0 赞/ 300 阅读

相关 vue路由嵌套，配置children嵌套路由

嵌套路由就是路由里面嵌套他的子路由，可以有自己的路由导航和路由容器（router-link、router-view），通过配置children可实现多层嵌套 //mi

r囧r小猫/ 2022年05月20日 05:00/ 0 赞/ 417 阅读

相关嵌套组件与嵌套路由的使用

基于多级菜单栏的嵌套组件的使用涉及文件:入口文件main.js,主组件App.vue,layouts目录下的index.js,组件layouts.vue,组件appCo

布满荆棘的人生/ 2022年02月03日 18:27/ 0 赞/ 280 阅读

相关 vue-router—5嵌套路由的使用

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2ppYW9q

今天药忘吃喽~/ 2022年01月21日 10:43/ 0 赞/ 291 阅读

相关 Vue路由（嵌套路由）的使用

1、vue-router介绍 vue-router是Vue.js的路由插件。适合用于构建单页面应用，基于路由和组件；路由用于设定访问路径，将路径和组件映射起来。路径

￡神魔★判官ぃ/ 2021年09月20日 09:08/ 0 赞/ 628 阅读

相关 vue 路由嵌套(二级路由)

路由嵌套就是在父路由配置好后,配置一个children属性,里面放置的的内容跟routes属性下面的内容大体一样,这就是二级路由的配制方法。嵌套路由的关键字childr

青旅半醒/ 2021年07月27日 01:47/ 0 赞/ 876 阅读