How to correctly divide the user interface into user roles?

Question

Vue.js

Good day.
How to make sure that when logging in, one component is displayed to a user with one role, and another component is displayed to a user with a different role.
I use vuex and vue router. On the Laravel backend.
The situation does not seem complicated, but confused. Please help.

Thanks in advance!

Answer 1

You can put v-if right at the root of the components and specify a value depending on the role of each component.
Well, output both, just one will cut itself out at this moment.
Or make a wrapper component that will connect the right one via https://ru.vuejs.org/v2/guide/components.html#%D0%...
Or make two routes and redirect to the right one if the role is wrong.
So many ways :)