Bagaimana untuk menutup halaman tengah dalam pembangunan uniapp

Semasa proses pembangunan uniapp, kami selalunya perlu menutup halaman. Tetapi bagaimana untuk menutup hanya halaman tengah apabila menutup halaman? Artikel ini akan memperkenalkan cara melaksanakan fungsi ini dalam pembangunan uniapp.

Langkah pertama: Fahami susunan halaman

Dalam uniapp, kita boleh menggunakan uni.navigateTo dan uni.redirectTo untuk melompat ke halaman, dan kita juga boleh menggunakan uni.navigateBack untuk kembali ke halaman sebelumnya. Dalam proses melompat dan kembali ke halaman, susunan halaman memainkan peranan penting.

Timbunan halaman ialah tatasusunan yang menyimpan semua halaman dalam tindanan halaman semasa. Melalui timbunan halaman, kita boleh melompat antara halaman, lulus parameter dan menutup halaman.

Secara lalai, tindanan halaman bermula dari halaman utama (iaitu app.vue), dan halaman atas diletakkan pada penghujung tindanan halaman.

Sebagai contoh, kami melompat ke halaman A melalui uni.navigateTo, dan kemudian melompat ke halaman B melalui uni.navigateTo dalam halaman A. Pada masa ini, struktur susunan halaman adalah seperti berikut:

[ home, A, B ]

Antaranya, rumah ialah halaman utama, dan halaman teratas ialah B. Dalam halaman B, jika kita ingin kembali ke halaman A, kita boleh melakukannya melalui fungsi uni.navigateBack().

Bagaimana jika kita ingin menutup halaman B sambil kembali ke halaman A? Ini memerlukan kami untuk mengendalikan tindanan halaman.

Langkah 2: Memanipulasi tindanan halaman

Kami boleh menutup semua halaman melalui uni.reLaunch dan membuka semula halaman sasaran dalam halaman terbuka. Tetapi itu bukan yang kita perlukan kerana kita hanya mahu menutup halaman tengah.

Dalam uniapp, anda boleh mendapatkan tindanan halaman semasa melalui kaedah uni.getCurrentPages(). Kaedah ini mengembalikan tatasusunan yang menyimpan semua halaman dalam tindanan halaman semasa. Kami boleh beroperasi pada susunan halaman melalui tatasusunan ini.

Pertama, kita boleh mendapatkan status tindanan halaman semasa melalui getCurrentPages():

let pages = getCurrentPages()

Pada masa ini, tatasusunan halaman menyimpan semua halaman dalam tindanan halaman. Jika kita ingin menutup halaman semasa dan halaman sebelumnya dalam tindanan halaman, kita boleh melakukannya seperti ini:

let pages = getCurrentPages()
let currentPage = pages[pages.length - 1]
let prePage = pages[pages.length - 2]
currentPage.$destroy()
uni.navigateBack({
  delta: 1,
  success: function () {
    prePage.setData({
      foo: 'bar'
    })
  }
})

Dalam kod ini, kita mula-mula mendapat status tindanan halaman semasa. Kemudian, kejadian halaman semasa dan halaman sebelumnya diperoleh melalui currentPage dan prePage masing-masing. Kemudian, objek contoh halaman semasa boleh dimusnahkan melalui kaedah $destroy().

Akhir sekali, gunakan kaedah uni.navigateBack() untuk kembali ke halaman sebelumnya dan ubah suai data pada halaman sebelumnya.

Jika anda ingin menutup berbilang halaman, anda boleh menutup halaman satu demi satu dengan menggelungkannya. Sebagai contoh, jika anda ingin menutup halaman semasa, halaman sebelumnya dan halaman sebelumnya, anda boleh melakukannya seperti ini:

let pages = getCurrentPages()
for (let i = 0; i < 3; i++) {
  let currentPage = pages[pages.length - 1 - i]
  currentPage.$destroy()
}
uni.navigateBack({
  delta: 2,
  success: function () {
    // do something
  }
})

Dengan cara ini, anda boleh merealisasikan fungsi menutup bahagian tengah sahaja. muka surat.

Ringkasan

Dalam pembangunan uniapp, tindanan halaman ialah konsep yang sangat penting. Dengan memahami susunan halaman, kita boleh merealisasikan fungsi seperti melompat antara halaman, lulus parameter dan menutup halaman.

Untuk menutup halaman tengah, anda boleh menggunakan kaedah getCurrentPages() untuk mendapatkan status tindanan halaman semasa, menutup halaman satu demi satu melalui lintasan gelung dan akhirnya menggunakan kaedah uni.navigateBack() untuk kembali ke halaman sebelumnya.

Saya harap artikel ini dapat membantu anda!

Atas ialah kandungan terperinci Bagaimana untuk menutup halaman tengah dalam pembangunan uniapp. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!