Vue stepping on the pit of vue-router failed to mount the page

Problem Description

System: macOS Catalina 10.15.4
Background: Designing nested routing
Problem: vue-router failed to mount the page

This is the situation I encountered, for reference only~
Tips : You can directly see the problem and solve it~

problem solved

Design a nested route, and found that the page cannot be mounted. The following solutions:

View app

Check App.vueif there is a <router-view />label in the file , if not, add it.

<template>
  <div id="app">
    <a-button>按钮</a-button>
    <div id="nav">
      <router-link to="/">Home</router-link> |
      <router-link to="/about">About</router-link>
    </div>
    <router-view />
  </div>
</template>

<style lang="less"></style>

router.js

Check importwhether the path in the routing file is correct.

import Vue from "vue";
import Router from "vue-router";
import Home from "./views/Home.vue";

Vue.use(Router);

export default new Router({
    
    
  mode: "history",
  base: process.env.BASE_URL,
  routes: [
    {
    
    
      path: "/user",
      //component: RenderRouterView,
      component: {
    
     render: h => h("router-view") },
      children: [
        {
    
    
          path: "/user/login",
          name: "login",
          component: () =>
            import(/* webpackChunkName: "user" */ "./views/User/Login.vue")
        },
        {
    
    
          path: "/user/register",
          name: "register",
          component: () =>
            import(/* webpackChunkName: "user" */ "./views/User/Register.vue")
        }
      ]
    },
    {
    
    
      path: "/",
      name: "home",
      component: Home
    },
    {
    
    
      path: "/about",
      name: "about",
      component: () =>
        import(/* webpackChunkName: "about" */ "./views/About.vue")
    }
  ]
});

If the above still fails to mount

After the above two problems are solved, the page refresh still fails to mount. Through Chrome plug-in vue-devtoolsinspection, it is found that the initial interface Aboutcan be successfully mounted, but the nested loginand registermounted failed, that router-viewis , it is not displayed.
Insert picture description here

After checking the code several times, it is confirmed that there is no error, there is only the last way left, restart Dafa~

$ npm run serve

Fortunately, the page was successfully mounted after the restart~
Insert picture description here

Reference link

https://router.vuejs.org/zh/guide/essentials/nested-routes.html
https://time.geekbang.org/course/detail/100024601-91010

If there are mistakes or not rigorous, please correct me, thank you very much.
My blog: http://breadhunter.gitee.io