Routage imbriqué (sous-routage) de Vue.js

Cette fois, je vais vous présenter le routage imbriqué (sous-route) de Vue.js Quelles sont les précautions lors de l'utilisation du routage imbriqué (sous-route) de Vue.js. ? Ce qui suit est un cas pratique, jetons-y un œil.

enfants
Routage imbriqué, le routage enfant est inséré dans le composant parent pomme

let router = new VRouter({ // 如果mode设为history, 那么地址就可以不使用哈希(# 哈希)了,就可以直接访问. http://localhost:8080/#/apple ==>> http://localhost:8080/apple
  mode: 'history',  routes: [    //  做一个映射表
    {      path: '/apple',      component: Apple,      // 嵌套路由,子路由插入到了父组件apple中
      children: [
        {          path: 'red',          component: RedApple
        }
      ]
    },
    {      path: '/banana',      component: Banana
    }
  ]
})

Dans le composant pomme de routage parent, insérez le composant RedApple

<template>  <div class="hello">
    .......    <router-view></router-view>
  </div></template>

to red apple
<router-link :to="{path:&#39;apple/red&#39;}">to red apple</router-link>

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour un contenu plus passionnant, veuillez faire attention au site Web chinois php autres articles liés. !

Lecture recommandée :

Attributs des balises Vue et rendu conditionnel de Vue.js

À quoi devez-vous faire attention lorsque en utilisant Vue.js Matter

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!