Как вложить навигацию внутри другой навигации, чтобы предотвратить перезагрузку основного route-view?

Для реализации вложенной навигации без перезагрузки основного route-view, можно использовать динамическое вложение компонентов.

Для этого, можно создать отдельный компонент для второго route-view, который будет отображаться внутри основного route-view. В этом компоненте можно использовать навигацию, без указания пути к основному route-view.

Пример реализации:

assets/js/router.js:
```
import Vue from 'vue';
import Router from 'vue-router';
import Main from '@/components/Main.vue';
import Second from '@/components/Second.vue';

Vue.use(Router);

export default new Router({
  mode: 'history',
  routes: [
    {
      path: '/',
      name: 'Main',
      component: Main,
    },
    {
      path: '/second',
      name: 'SecondRoute',
      component: Second,
    },
  ],
});
```

assets/components/Main.vue:
```
<template>
  <div>
    <h1>Main Route</h1>
    <router-view></router-view><!-- Здесь будут отображаться компоненты для второго route-view -->
  </div>
</template>
```

assets/components/Second.vue:
```
<template>
  <div>
    <h2>Second Route</h2>
    <router-link to="/product/game">Game</router-link><!-- Вложенные ссылки для навигации -->
    <router-link to="/product/news">News</router-link>
    <router-view></router-view><!-- Здесь будут отображаться компоненты для вложенной навигации -->
  </div>
</template>
```

Теперь, когда вы переходите на /second, компонент Second будет отображаться внутри основного route-view. Внутри компонента Second можно использовать вложенную навигацию с помощью router-view и router-link.

Примечание: Если вы все же хотите использовать children в route.js для вложенных путей, вы можете попробовать добавить meta свойство в основной маршрут и использовать его для проверки во втором route-view. Например:

router.js:
```
import Vue from 'vue';
import Router from 'vue-router';
import Main from '@/components/Main.vue';
import Product from '@/components/Product.vue';
import Game from '@/components/Game.vue';
import News from '@/components/News.vue';

Vue.use(Router);

export default new Router({
  mode: 'history',
  routes: [
    {
      path: '/',
      name: 'Main',
      component: Main,
    },
    {
      path: '/product',
      component: Product,
      children: [
        {
          path: 'game',
          name: 'Game',
          component: Game,
          meta: { nestedRoute: true }, // добавляем meta свойство во второй роут
        },
        {
          path: 'news',
          name: 'News',
          component: News,
          meta: { nestedRoute: true }, // добавляем meta свойство во второй роут
        },
      ],
    },
  ],
});
```

Product.vue:
```
<template>
  <div>
    <h2>Product</h2>
    <router-link to="/product/game">Game</router-link>
    <router-link to="/product/news">News</router-link>
    <router-view></router-view>
  </div>
</template>
```

Game.vue:
```
<template>
  <div>
    <h3>Game</h3>
    <!-- Компоненты для вложенной навигации -->
  </div>
</template>
```

News.vue:
```
<template>
  <div>
    <h3>News</h3>
    <!-- Компоненты для вложенной навигации -->
  </div>
</template>
```

При использовании данного подхода, роуты /product/game и /product/news будут отображаться внутри Product.vue без перезагрузки основного route-view.