Melepasi parameter pada halaman uniapp yang berbeza

Dengan populariti Internet mudah alih, pembangunan aplikasi mudah alih telah menarik lebih banyak perhatian. Sebagai salah satu rangka kerja pembangunan merentas platform yang paling popular, Uniapp digunakan secara meluas dalam pembangunan aplikasi mudah alih. Dalam pembangunan Uniapp, cara memindahkan parameter antara halaman yang berbeza adalah masalah yang sangat biasa Artikel ini akan memperkenalkan cara memindahkan parameter antara halaman yang berbeza dalam Uniapp dari beberapa aspek.

1. Parameter pertanyaan melepasi

Dalam Uniapp, parameter boleh dihantar melalui parameter pertanyaan halaman. Sebagai contoh, kita boleh melompat ke halaman butiran dengan mengklik butang pada halaman utama, dan menghantar ID produk ke halaman butiran Kod dilaksanakan seperti berikut:

// Kod lompat pada halaman utama
uni.navigateTo( {
url: '/pages/detail/detail?id=' + this.goodsId
});

// Dapatkan kod dalam halaman butiran
onLoad(options) {
this.goodsId = options.id;
}

Dalam halaman utama, kami melompat ke halaman butiran melalui kaedah uni.navigateTo, dan hantar id produk ke halaman butiran melalui parameter pertanyaan. Dalam halaman butiran, kami memperoleh ID produk yang diluluskan melalui parameter pilihan dalam kaedah onLoad dan menetapkannya kepada itemId berubah yang sepadan dengan halaman butiran.

2. Pemindahan parameter Vuex

Dalam Uniapp, anda boleh menggunakan Vuex untuk memindahkan parameter antara halaman yang berbeza. Vuex ialah perpustakaan pengurusan negeri yang direka khas untuk rangka kerja Vue.js, yang boleh merealisasikan perkongsian keadaan antara komponen yang berbeza. Dalam Uniapp, anda boleh menentukan pembolehubah global dalam Vuex dan memperkenalkan Vuex ke dalam halaman yang perlu lulus parameter, dengan itu merealisasikan pemindahan parameter antara halaman.

Sebagai contoh, kita boleh mentakrifkan pembolehubah global goodsId dalam keadaan Vuex, menukar nilai pembolehubah pada halaman utama dan mendapatkan nilai pembolehubah pada halaman butiran Kod tersebut dilaksanakan seperti berikut :

// Takrifkan global variable goodsId
nyatakan: {
goodsId: ''
}

// Tukar nilai pembolehubah ini dalam halaman utama
kaedah: {
jumpToDetail() {

this.$store.state.goodsId = '123456';
uni.navigateTo({
  url: '/pages/detail/detail'
});

}
}

// Dapatkan nilai pembolehubah ini dalam halaman butiran
dikira: {
goodsId() {

return this.$store.state.goodsId;

}
}

Dalam halaman utama, kami menetapkan nilai kepada global variable goodsId melalui ini.$store.state.goodsId, dan melompat ke butiran halaman melalui kaedah uni.navigateTo. Dalam halaman butiran, kami memperoleh pembolehubah goodsId dalam Vuex melalui atribut yang dikira untuk mendapatkan nilai yang diluluskan.

3. Pemindahan parameter bas acara

Dalam Uniapp, kami juga boleh menggunakan bas acara untuk memindahkan parameter antara halaman yang berbeza. Bas acara ialah corak reka bentuk yang membolehkan komponen berbeza berkomunikasi dan lulus parameter dengan mendengar peristiwa dan mencetuskan peristiwa. Dalam Uniapp, anda boleh menggunakan kaedah uni.$emit dan uni.$on untuk memantau dan mencetuskan peristiwa.

Sebagai contoh, kita boleh mencetuskan acara melalui kaedah uni.$emit pada halaman utama, dan mendengar acara melalui kaedah uni.$on pada halaman butiran, dengan itu merealisasikan pemindahan parameter kod dilaksanakan seperti berikut:

// Gunakan uni.$emit untuk mencetuskan acara pada halaman utama
kaedah: {
jumpToDetail() {

uni.$emit('goodsId', '123456');
uni.navigateTo({
  url: '/pages/detail/detail'
});

}
}

// Pada halaman butiran Gunakan uni.$on untuk mendengar acara
onLoad() {
uni.$on('goodsId', (goodsId) => {

this.goodsId = goodsId;

});
}

Dalam halaman utama, kami mencetuskan acara bernama 'goodsId' melalui kaedah uni.$emit dan lulus id produk '123456' sebagai parameter. Dalam halaman butiran, kami mendengar acara yang dinamakan 'goodsId' melalui kaedah uni.$on dalam kaedah onLoad dan memberikan id produk yang diluluskan kepada goodsId berubah yang sepadan dengan halaman butiran.

Ringkasnya, pemindahan parameter antara halaman berbeza dalam Uniapp boleh dicapai melalui pemindahan parameter pertanyaan, pemindahan parameter Vuex dan pemindahan parameter bas peristiwa. Pembangun boleh memilih kaedah yang sesuai untuk lulus parameter berdasarkan keperluan sebenar untuk merealisasikan keperluan fungsi aplikasi dengan lebih baik.

Atas ialah kandungan terperinci Melepasi parameter pada halaman uniapp yang berbeza. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!