Rumah  >  Artikel  >  hujung hadapan web  >  Cara melaksanakan lompatan dengan parameter dalam penghalaan uniapp

Cara melaksanakan lompatan dengan parameter dalam penghalaan uniapp

PHPz
PHPzasal
2023-04-06 16:44:385074semak imbas

UniApp ialah rangka kerja pembangunan merentas platform yang menyokong penulisan kod sekali dan menerbitkannya ke berbilang platform pada masa yang sama. Dalam UniApp, kita selalunya perlu menggunakan fungsi lompat laluan untuk melompat antara halaman yang berbeza. Antaranya, melompat dengan parameter adalah situasi yang agak biasa. Artikel ini akan memperkenalkan penghalaan UniApp dengan lompatan parameter.

1. Lompat laluan

Dalam UniApp, kami melaksanakan lompat laluan melalui fungsi uni.navigateTo(). Fungsi ini boleh digunakan untuk melompat dari satu halaman ke halaman lain, seperti melompat dari halaman utama ke halaman butiran. Berikut ialah contoh lompatan asas:

// index.vue
uni.navigateTo({
  url: '/pages/detail/detail'
})

Dalam contoh di atas, laluan lompat ditentukan melalui parameter url. Laluan ini ialah laluan relatif bermula dengan "/", yang bermaksud melompat ke halaman butiran dalam direktori halaman.

2 Lompat dengan parameter

Apabila kita perlu memindahkan beberapa data antara halaman, kita perlu menggunakan lompat dengan parameter. Contohnya, apabila melompat dari halaman senarai ke halaman butiran, anda perlu lulus ID item yang sedang dipilih. Dalam UniApp, parameter boleh dihantar melalui parameter pertanyaan apabila menggunakan fungsi uni.navigateTo(). Berikut ialah contoh melompat dengan parameter:

// list.vue
uni.navigateTo({
  url: '/pages/detail/detail?id=' + item.id
})

Dalam contoh di atas, parameter diluluskan dengan menambahkan rentetan pertanyaan dalam parameter url. Rentetan pertanyaan bermula dengan "?", diikuti dengan nama parameter dan nilai parameter, dan menggunakan "&" untuk memisahkan berbilang parameter. Contohnya, "id=1&name=Zhang San" bermaksud dua parameter, ID dan nama, diluluskan, dan nilainya masing-masing ialah 1 dan Zhang San.

Apabila menerima parameter, kita boleh mendapatkan parameter yang diluluskan melalui atribut ini.$route.query. Contohnya:

// detail.vue
console.log(this.$route.query.id) // 输出传递过来的ID参数的值

Dalam contoh di atas, nilai parameter ID diperoleh melalui ini.$route.query.id dan output ke konsol.

3. Ringkasan

Melompat dengan parameter digunakan secara meluas dalam UniApp dan boleh digunakan untuk menghantar pelbagai parameter dan data. Dengan menggunakan uni.navigateTo() dan parameter pertanyaan, kami boleh melaksanakan lompatan halaman dengan parameter dengan mudah. Apabila kita perlu melompat ke halaman semasa membangunkan aplikasi UniApp, kita boleh merujuk kepada contoh di atas dan menggunakan kaedah yang sepadan untuk mencapainya.

Atas ialah kandungan terperinci Cara melaksanakan lompatan dengan parameter dalam penghalaan uniapp. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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