Rumah > hujung hadapan web > View.js > 3 cara untuk melaksanakan pemuatan atas permintaan laluan (pemuatan malas laluan) dalam Vue

3 cara untuk melaksanakan pemuatan atas permintaan laluan (pemuatan malas laluan) dalam Vue

藏色散人
Lepaskan: 2022-08-10 10:22:05
ke hadapan
1767 orang telah melayarinya

Mengapa kita memerlukan pemuatan malas?

Untuk aplikasi satu halaman seperti vue, jika tiada aplikasi lazy loading, fail yang dibungkus dengan webpack akan menjadi luar biasa besar, mengakibatkan kandungan yang perlu dimuatkan apabila memasuki halaman utama. Terlalu banyak dan terlalu panjang akan menyebabkan skrin putih yang panjang Walaupun pemuatan dilakukan, ia tidak kondusif untuk pengalaman pengguna Menggunakan pemuatan malas boleh membahagikan halaman dan memuatkan halaman apabila diperlukan, yang boleh berkongsi dengan berkesan beban halaman utama. Tanggung tekanan pemuatan dan kurangkan masa pemuatan halaman utama [Cadangan berkaitan: tutorial video vue.js]

  • komponen asynchronous vue

  • penghala vue mengkonfigurasi penghalaan dan menggunakan teknologi komponen tak segerak vue untuk mencapai pemuatan atas permintaan

    Walau bagaimanapun, dalam kes ini, komponen menjana fail js

  • /* vue teknologi komponen tak segerak*/
  • { laluan: '/home', nama: 'home',

    komponen: resolve =>
  • ([' @/komponen/rumah'],selesaikan)
},

{ laluan: '/index', nama: 'Indeks', komponen: selesaikan => '@/components/index '],resolve) },

{ path: '/about', name: 'about', component: resolve => ,selesaikan) }


Pemuatan tidak malas:

Pemuatan malas

2. Penyelesaian pemuatan malas komponen 2. Laluan pemuatan malas (menggunakan import)

3 -router mengkonfigurasi penghalaan dan menggunakan keperluan webpack.pastikan teknologi juga boleh melaksanakan pemuatan atas permintaan.

Dalam kes ini, berbilang laluan yang menyatakan chunkName yang sama akan digabungkan dan dibungkus ke dalam satu fail js.

Atas ialah kandungan terperinci 3 cara untuk melaksanakan pemuatan atas permintaan laluan (pemuatan malas laluan) dalam Vue. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:csdn.net
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan