Home

my route
pages/
-|user-admin/
----|main/
------|settings/
------| index.vue //
------| settings.vue // <-- nested level two
--------| user-info.vue // not include parent(settings.vue)'s other layout
----| index.vue // <-- redirect to /user-admin/main
----| main.vue // <-- nested level one

here is level one:

<template lang="pug">
  nuxt-child
</template>
<script>
  export default {
    layout: 'user-admin'
  }
</script>

and level two:

<template lang="pug">
  .ua-category
    affix(:list="menu", category="main")
    .ua-category-content.ua-content.ua-content-hasCarbon(:class="{'category-content-hidden': visible}")
      div hello
      nuxt-child
</template>
<script>
  import { uaPrefix } from '~/store/module-prefixs'
  import Affix from '~/components/user-admin/Affix.vue'

  export default {
    layout: 'user-admin',
    computed: {
      visible () { return this.$store.state[uaPrefix].visibleAffix },
      menu () { return this.$store.state[uaPrefix].menus.main }
    },
    components: {
      Affix
    }
  }
</script>

the problem is when i access: /user-admin/main/settings/user-info
no Affix.vue components included
and access: /user-admin/main/settings
404 return