4.子路由，嵌套路由

4-1配置子路由—children

Tips：在主路由的children属性中去配置
子路由配置完成后要在主路由页面添加路由跳转,eg:

//1.新建两个页面views/ComingSoon.vue   NowPlaying.vue
//2.配置路由界面,router/index.js,挂在films页面下
const routes = [
  {
    path: '/films',
    name: 'films',
    component: Films,
    children:[
      {
        path:'nowPlaying',
        component:()=>import('../views/NowPlaying.vue')     
      },
      {
        path:'comingSoon',
        component:()=>import('../views/ComingSoon.vue')
      }
    ]
  }
    ...
]

4-2在主路由对应的组件中去设置router-view

目的：router-view去装载这些子路由。router-view本质上就是一个动态组件

//在Films.vue组件中去配置
<template>
  <div class="home">
    <img alt="Vue logo" src="../assets/logo.png">
    <router-link to="/detail" tag="p">{{city}}</router-link>
    <div>
      <router-link to="/films/nowPlaying">正在热映</router-link>     //子路由
      <router-link to="/films/comingSoon">即将上映</router-link>
    </div> 
     <router-view></router-view>
  </div>
</template>