Vue dynamically loads the routing page blank and refreshes it before the page can be displayed normally.

I dynamically get menu information from the background, and then dynamically load the route after processing, but the page is loaded with a blank for the first time and can only be refreshed once. The code is as follows. Please take a look at where the problem is.

clipboard.png

clipboard.png

store.dispatch("GenerateRoutes").then((res) => { // roles
    if(res.data){
        console.log(store.getters.addRouters,"testrouter")
        router.addRoutes(store.getters.addRouters) // 
        setlocalExpirytime.setAge(1*60*1000).set("routertime")
        next({ ...to, replace: true }) // hack addRoutes ,set the replace: true so the navigation will not leave a history record
    }else{
        iView.Modal.warning({
            title: "",
            content: res.info,
            onOk(){
                store.dispatch("LogOut").then((res) => {
                    location.reload();
                    console.log(res,"logout")
                }).catch(err=>{
                    console.log(err,"logout")
                });
            }
        });
    }
}).catch((err)=>{
      console.log(err,"routererr")
})

although it has been a long time, reply and record the answer. After the login is successful, it can be solved by adding the accessible routing table dynamically again with the code.


there is no menu bar, and there is a route. If the menu value is rendered once, the menu will not change after addRoutes


how to solve it? Mine also needs to be refreshed to display


how to solve

Menu