Apakah yang perlu saya lakukan jika projek Vue melaporkan ralat semasa mengubah hala dalam penghalaan IE?

Jika anda sedang membangunkan projek yang menggunakan rangka kerja Vue.js dan menggunakan Penghala Vue untuk mengurus laluan, anda mungkin menghadapi masalah: di bawah pelayar IE, lompat laluan akan melaporkan ralat.

Masalah ini biasanya disebabkan oleh Vue Router menggunakan mod Sejarah HTML5, tetapi pelayar IE tidak menyokong mod ini. Tetapi jangan risau, di bawah kami akan menunjukkan kepada anda cara untuk menyelesaikan masalah ini.

Penyelesaian

1. Perkenalkan polyfill

Mod Sejarah HTML5 memerlukan penyemak imbas menyokong API HTML5, manakala penyemak imbas IE hanya menyokong versi API HTML yang lebih awal, jadi kita perlu menggunakan polyfill untuk menjadikannya serasi.

Anda boleh menggunakan kod berikut untuk memperkenalkan polyfill:

<!-- 引入 polyfill -->
<script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>

2. Konfigurasikan mod penghalaan

Untuk menyelesaikan masalah yang dilakukan oleh pelayar IE tidak menyokong mod Sejarah, kami Mod penghalaan Vue Router perlu diubah suai. Tukarnya daripada mod Sejarah lalai kepada mod Hash.

Dalam fail konfigurasi Penghala Vue, cari kod berikut:

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

Tukar nilai mode daripada history kepada hash:

const router = new VueRouter({
  mode: 'hash',
  routes
})

3. Konfigurasikan pelayan

Jika projek anda juga perlu berinteraksi dengan pelayan semasa penggunaan, anda perlu mengkonfigurasi pelayan untuk menyokong lompatan penghalaan. Apabila menggunakan mod Sejarah Penghala Vue, apabila pengguna memasukkan alamat dalam bar alamat penyemak imbas, pelayan akan lalai kepada andaian bahawa pengguna perlu mengakses fail atau direktori di bawah alamat, dan akan menghantar permintaan kepada pelayan sistem fail untuk pemprosesan. Tetapi dalam amalan, apa yang kami lebih suka ialah menghantar permintaan kepada Penghala Vue untuk diproses supaya halaman semasa boleh dipaparkan dengan betul.

Jika anda menggunakan Node.js sebagai pelayan, anda boleh mengkonfigurasinya melalui kod berikut:

const express = require('express')
const app = express()

app.use(express.static(__dirname + '/dist'))

// 对所有请求都返回 index.html 文件
app.get('*', function(req, res) {
  res.sendFile(__dirname + '/dist/index.html')
})

const port = process.env.PORT || 8080
app.listen(port, () => {
  console.log(`Server started at ${port}`)
})

Kod di atas menggunakan rangka kerja ekspres dan menyediakan folder statik untuk menyimpan sumber statik laman web. Untuk semua permintaan, fail index.html akan dikembalikan untuk memastikan Vue Router berfungsi dengan betul dan mengendalikan permintaan ubah hala.

Ringkasan

Di atas ialah kaedah untuk menyelesaikan ralat lompat penghalaan projek Vue di bawah pelayar IE. Apabila menghadapi masalah ini, anda boleh cuba menggunakan polyfill untuk keserasian, mengubah suai mod penghalaan atau mengkonfigurasi pelayan Di bawah premis untuk memastikan pengubahsuaian adalah betul, projek boleh berjalan seperti biasa dalam pelayar IE.

Atas ialah kandungan terperinci Apakah yang perlu saya lakukan jika projek Vue melaporkan ralat semasa mengubah hala dalam penghalaan IE?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!