Laravel – wie Vue-Router Routen asynchron lädt
PHPz
PHPz 2017-05-16 16:48:20
0
2
784

Aktuelle Projektbenutzerberechtigungsabhängigkeiten:

  • Grundlegende Benutzerberechtigungen

  • Berechtigungen Ihrer Abteilung

  • Berechtigungen Ihrer Position

  • Spezielle Benutzerberechtigungen

Da Berechtigungen kompliziert sind und die Routen im Frontend fest codiert sind, muss ein normaler Mitarbeiter nach der Anmeldung Hunderte oder sogar Tausende von Routen und entsprechenden Komponenten laden.

  1. Leistungsprobleme

  2. Eine Berechtigungsüberprüfung ist sowohl im Frontend als auch im Backend erforderlich. Der Gedanke daran bereitet mir Kopfschmerzen

Basierend auf diesen beiden Überlegungen haben wir beschlossen, die Routen in die Datenbank zu schreiben, und dann weist das Backend basierend auf den Berechtigungen des angemeldeten Benutzers Routen dynamisch dem Frontend zum Laden zu.

Aber wenn ich Ajax zum Anfordern im Frontend verwende, stelle ich fest, dass Routing-Daten immer aus dem Hintergrund angefordert werden, nachdem die Vue-Initialisierung abgeschlossen ist (d. h. die Route wurde geladen)

Der angeforderte Code wird auf die gleiche Weise in main.js und vor dem Erstellen des Vue-Lebenszyklus platziert

const routes = [];

const router = new VueRouter({
    mode: 'history',
    linkActiveClass: 'active',
    routes
})

const app = new Vue({
    router,
    el: '#app',
    data: routes,
    template: '<App/>',
    components: { App },
    created: function () {
        const self = this
        axios.get('https://service.it/api/routes')
            .then(function (response) {
                self.routes = response.data;
            })
            .catch(function (error) {
                console.log(error)
            })
    }
})

Bitte fragen Sie den Front-End-Master nach Antworten!

PHPz
PHPz

学习是最好的投资!

Antworte allen(2)
phpcn_u1582

vue-router@2.2.0开始,router.addRoute(routes)动态添加路由

滿天的星座

使用axios 先ajax请求得到路由配置 再初始化vue实体

Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!