Vue: An Implementation Scheme for Generating Routing (Dynamic Routing) Based on Values from Background

  javascript, vue.js

The company has to build a background management system, and then different roles may correspond to different left menus, i.e. a dynamic route, and everyone can see different things.
I have seen the document of “Flower Pants” before, that is, the back end returns the user role, and then the front end dynamically controls the routing according to the user role. Now I want the back end to directly return the data and render according to the data.
The background returns similar data:

Then it is implemented by addRoutes method.
I would like to ask you whether you have done this, whether it is reasonable to do so, or whether you have any plans that have been put into practice. I hope you can put forward some opinions.

It was not long since I first joined vue, so I knew little about some things.
Thank you for your comments, combined with the thinking of each respondent, decided to such a way of implementation
1. when the login succeeds in jumping, do route interception router.beforeEach, at this time to request the background data, return to the user’s correspondingThe entire routing list
2. With the original Hard coding several routes concat without permission, using the router.addRoutes method to realize the final route to be presented
3. Of course, there will be components to traverse the final generated routes route and generate the left sidebar

I will share the pits found when I actually use them. The front-end primary school students thank you all.