Shulou(Shulou.com)06/01 Report--

This article is about how vue router rights management enables different roles to display different routes. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.

Train of thought:

When logging in, the login page is marked with the role and stored in the local cache (localstorage)

Route js file with meta attribute plus whether it is visible (visiable true or false)

Home basic navigation bar page logic, you can first get to all the first-level menus and role tags

For Loop level 1 menu

Find out the role array that the role is in (determine whether a value is in the array or not)

Then the array visiable is changed to true, and the rest to false

The ui framework is ant design of vue

Main logic code

1-Landing page

2-routing page

3-home menu bar common page

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.