Apakah mod penghalaan vue yang berbeza?

Penghalaan Vue mempunyai tiga mod: Hash, Sejarah dan Abstrak. Perbezaan: 1. Aksara # akan muncul dalam laluan URL dalam mod cincang, tetapi tidak dalam mod lain 2. Perubahan dalam nilai cincang akan mencetuskan peristiwa pertukaran cincang, tetapi tidak dalam mod lain; dimuatkan semula, dan rekod sejarah boleh disimpan, yang mudah Ke hadapan dan ke belakang, mod lain tidak boleh.

Persekitaran pengendalian tutorial ini: sistem windows7, versi vue3, komputer DELL G3.

Sebenarnya terdapat tiga mod penghalaan vue:

• Cincang: Gunakan nilai cincang URL sebagai laluan. Menyokong semua pelayar.

• Sejarah: Sejak API Sejarah HTML5 dan konfigurasi pelayan

• Abstrak: Menyokong semua mod berjalan javascript. Jika didapati tiada API pelayar, penghalaan akan secara automatik memasuki mod ini.

vue-router menggunakan mod cincang secara lalai, iaitu URL berikut akan muncul:, URL mempunyai tanda #

Kami boleh menggunakan kod berikut untuk mengubah suainya menjadi mod sejarah:

import Vue from 'vue'
import Router from 'vue-router'
const userInfo = () => import('@/views/userInfo')
Vue.use(Router)

export default new Router({
  mode: 'history',//hash abstract
  routes: [
    {
      path: '/user-info/:userId',
      component: userInfo
    }
  ]
})

Perbezaan

Mod cincang:

• # aksara akan muncul dalam laluan url

• Nilai cincang tidak disertakan dalam permintaan HTTP Ia diproses oleh bahagian hadapan-. tamatkan penghalaan, jadi ia tidak mengubah nilai cincang Halaman akan dimuat semula dan tiada permintaan akan dihantar ke pelayan

• Perubahan dalam nilai cincang akan mencetuskan peristiwa pertukaran cincang

mod sejarah:

• Seluruh alamat dimuatkan semula, sejarah boleh disimpan untuk mudah ke hadapan dan ke belakang

• Gunakan HTML5 API (tidak disokong oleh penyemak imbas lama) dan konfigurasi pelayan HTTP Jika tiada konfigurasi latar belakang, 404 akan muncul apabila halaman dimuat semula 🎜>

(Belajar perkongsian video:

pembangunan bahagian hadapan web

,

location / {
  try_files $uri $uri/ /index.html;
}

Video pengaturcaraan asas

)

Atas ialah kandungan terperinci Apakah mod penghalaan vue yang berbeza?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!