Penerangan ringkas

Baru-baru ini, saya telah mengkaji isu kawalan kebenaran berdasarkan RBAC di bawah pemisahan bahagian hadapan dan belakang Apabila menggunakan vue-router untuk menambah laluan secara dinamik, saya perlu meminta bantuan anda.

Idea umum adalah seperti berikut:

• Selepas pengguna latar belakang berjaya log masuk, senarai kebenaran yang sepadan dengan pengguna diperoleh daripada pelayan dan disimpan dalam sessionStorage

• Ubah hala pengguna ke halaman utama bahagian belakang

• Dalam cangkuk router.beforeEach(), baca data senarai kebenaran dalam sessionStorage dan panggil router.addRoutes() untuk menambah laluan secara dinamik.

Kod

 router.beforeEach(ke, dari, seterusnya)
    {
        ...
        biarkan kebenaran = JSON.parse(window.sessionStorage.getItem('permission'))
        /*permission = [...{"client_route":"/test"}...]*/
        jika (kebenaran) {
            biarkan newRoutes = []
            permission.map((item, index) => {
                newRoutes.push({
                    laluan:'${item.client_route}',
                    komponen: '../view${item.client_route.slice(1)}.vue',
                    meta:{Auth:true}
                })
            })
            router.addRoutes(newRoutes)
        }
        ...
    }

Inilah masalahnya

1. Adakah terdapat sebarang masalah dengan idea itu?

2. Terdapat masalah dengan kod di atas. Saya tidak tahu cara menangani ${} dalam laluan dan komponen. Maafkan saya kerana tidak mempelajari es6 dengan baik. ︶﹏︶") . Niat asal saya adalah untuk memuatkan fail .vue

berdasarkan nama laluan yang dikembalikan.

Terima kasih semua