Berbagi teknologi

Tetapkan beberapa rute agar dapat diakses publik dan tidak memerlukan status login untuk mengaksesnya

2024-07-08

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

Dalam kerangka aplikasi satu halaman (SPA), seperti Vue.js, penjaga rute adalah fitur yang sangat berguna yang memungkinkan Anda mengontrol akses ke rute. Vue.js menggunakan Vue Router sebagai manajer perutean resminya. Penjaga perutean terutama dibagi menjadi penjaga global dan penjaga intra-komponen.

Berikut adalah contoh cara mengatur penjaga rute agar rute tertentu dapat diakses publik:

  1. Garda terdepan global: Dalam konfigurasi Vue Router, Anda dapat menggunakan beforeEach Metode ini menyiapkan penjaga depan global untuk memeriksa apakah pengguna telah login dan mengarahkan pengguna sesuai dengan status login.
// router/index.js
import Vue from 'vue';
import Router from 'vue-router';
import Home from '../components/Home.vue';
import Dashboard from '../components/Dashboard.vue';

Vue.use(Router);

const router = new Router({
  routes: [
    {
      path: '/',
      name: 'Home',
      component: Home
    },
    {
      path: '/dashboard',
      name: 'Dashboard',
      component: Dashboard,
      meta: {
        requiresAuth: true // 标记需要认证的路由
      }
    }
    // 其他路由...
  ]
});

// 全局前置守卫
router.beforeEach((to, from, next) =