Bagaimanakah Uniapp menghantar permintaan halaman?

Kata Pengantar

Dengan perkembangan pesat Internet mudah alih, aplikasi mudah alih semakin mendapat perhatian. Untuk memudahkan pembangun membangunkan aplikasi yang berjalan pada berbilang platform pada masa yang sama, Uniapp wujud. Uniapp ialah alat pembangunan merentas platform yang dibangunkan berdasarkan rangka kerja Vue.js Ia boleh dijalankan pada berbilang platform seperti iOS, Android, H5 dan program mini. Artikel ini akan membincangkan bagaimana dalam Uniapp, apabila kami memasuki halaman, Uniapp akan menghantar permintaan halaman.

Prinsip Uniapp menghantar permintaan halaman

Apabila kami memasuki halaman dalam Uniapp, ia sebenarnya melompat melalui mekanisme penghalaan Vue-router. Penghalaan merujuk kepada memaparkan kandungan halaman yang berbeza berdasarkan alamat URL yang berbeza Ia adalah salah satu bahagian teras aplikasi web. Dalam Uniapp, Vue-router akan menukar alamat URL yang perlu diubah hala ke komponen yang sepadan, dan kemudian melekapkan komponen ini ke halaman yang sepadan.

Apabila kami memasuki halaman, Uniapp akan meminta data yang sepadan berdasarkan alamat URL halaman semasa, dan kemudian memaparkan data ke halaman tersebut. Data ini boleh menjadi data antara muka API daripada pelayan atau data daripada storan tempatan. Untuk melaksanakan fungsi permintaan halaman, kami perlu menggunakan beberapa antara muka API yang berkaitan dalam Uniapp antara muka API ini ialah:

1. Uni.request(options)

Uni. . request(options) digunakan untuk memulakan permintaan rangkaian Pilihan parameternya mempunyai atribut berikut:

• url: alamat yang diminta.
• data: parameter permintaan, jenis ialah Object, ArrayBuffer, ArrayBufferView, Blob, Document, FormData, dsb.
• header: Tetapkan pengepala permintaan, jenisnya ialah Objek.
• kaedah: Kaedah permintaan, seperti GET, POST, PUT, dll. Lalainya ialah GET.
• dataType: Format data yang dijangka akan dikembalikan, seperti json, teks, html, dll., lalai ialah json.
• responseType: jenis data respons, seperti arraybuffer, blob, dokumen, json, teks, dll. Lalai ialah teks.

Uni.request(options) mengembalikan contoh Promise. Pemanggil boleh menggunakan kaedah then() untuk memproses data respons selepas permintaan berjaya, atau gunakan kaedah catch() untuk mengendalikan. meminta pengecualian.

2. Uni.showLoading(options)

Uni.showLoading(options) digunakan untuk memaparkan kotak gesaan memuatkan Pilihan parameternya mempunyai atribut berikut:

• tajuk: Tajuk kotak gesaan.
• topeng: Sama ada hendak memaparkan lapisan topeng latar belakang.
• tempoh: masa paparan kotak gesaan, dalam milisaat, lalai ialah 2000.

Uni.showLoading(options) mengembalikan contoh Promise. Pemanggil boleh menggunakan kaedah then() untuk mengendalikan logik selepas paparan berjaya, atau gunakan kaedah catch() untuk mengendalikan logik. selepas paparan gagal.

3. Uni.hideLoading()

Uni.hideLoading() digunakan untuk menyembunyikan kotak gesaan pemuatan Selepas memanggilnya, kotak gesaan pemuatan akan hilang.

Senario Aplikasi

Dalam pembangunan sebenar, kami biasanya menghantar permintaan apabila memasuki halaman untuk mendapatkan data yang diperlukan oleh halaman dan memaparkan data ke halaman. Berikut ialah contoh mudah:

// 在某个页面中发送请求
export default {
  data() {
    return {
      list: []
    }
  },
  onLoad() {
    Uni.showLoading({
      title: '正在加载...'
    })
    Uni.request({
      url: 'http://your.api.com', // 接口地址
      method: 'GET',
      dataType: 'json'
    }).then(res => {
      this.list = res.data // 将返回数据赋值给list属性
    }).catch(err => {
      console.log('请求失败', err)
    }).finally(() => {
      Uni.hideLoading()
    })
  }
}

Dalam contoh di atas, kami menggunakan kaedah Uni.showLoading() untuk memaparkan kotak gesaan pemuatan apabila halaman dimuatkan, dan kemudian gunakan Uni.request( ) kaedah untuk menghantar permintaan Dapatkan data antara muka dan tetapkan data kepada atribut senarai halaman. Akhir sekali, gunakan kaedah Uni.hideLoading() untuk menyembunyikan kotak gesaan pemuatan.

Kesimpulan

Melalui penjelasan artikel ini, saya percaya bahawa setiap orang mempunyai pemahaman tertentu tentang prinsip dan penggunaan Uniapp untuk menghantar permintaan halaman. Dalam pembangunan sebenar, kami boleh menggunakan API ini secara fleksibel untuk mengoptimumkan permintaan dan proses pemaparan sebanyak mungkin untuk meningkatkan pengalaman pengguna aplikasi.

Atas ialah kandungan terperinci Bagaimanakah Uniapp menghantar permintaan halaman?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!