How to control the default display of one of the subcomponents in vue?

router.js

 {
      path:"/index",
      name:"index",
      component:index,
      children:[
        {
          path:"/device/user",
          name:"user",
          component:user,
            children:[
             {
              path: "/device/deviceDisplay",
              name: "deviceDisplay",
              component: deviceDisplay
             }
           ]
        }

the grandchild component will not come out until I click on the sub-component in the diagram. How to set it to appear in the above picture style when clicking on the parent component?

Component-based router vue.js

Mar.21,2021


      path:'/index',
      name:'index',
      component:index,
      redirect:'/device/deviceDisplay',
      children:[
        {
          path:'/device/user',
          name:'user',
          component:user,
            children:[
             {
              path: '/device/deviceDisplay',
              name: 'deviceDisplay',
              component: deviceDisplay
             }
           ]
        }

what I understand is that the first one is selected by default and redirected

ide/essentials/redirect-and-alias.html" rel=" nofollow noreferrer "> https://router.vuejs.org/zh/g.

Previous: How to solve the problem that every time the version is sent to the server, the PC side will read the old code because of the cache?

Next: Vue-router sets the problem of global login blocking.