Reactjs中如何实现基于组件的角色和权限？

Question

Here I want to know how to implement roles and permissions for users with multi roles.

Rules like this:

Note : R = Read, W = Write, D = Delete

Role	Feature 1	Feature 2	Feature 3
Super Admin	RWD	RWD	RWD
Marketing	-	R	RW
Customer Service	-	RW	R

Please give me example with React Hook for implement this role and permission. Thank you!

Answer 1

really you dont need to do anything crazy for storing roles...

const roles = [
  { role: 'superAdmin', display: 'Super Admin', feature1: 'RWD', feature2: 'RWD', feature3: 'RWD' },
  { role: 'marketing', display: 'Marketing', feature1: null, feature2: 'R', feature3: 'RW' },
  { role: 'customerService', display: 'Customer Service', feature1: null, feature2: 'RW', feature3: 'R' }
]