見出し画像

uniappでリクエストインターセプターを実装

1.結果

リクエストが送信されるたびに、「Loading」が表示される。

2.ソースコード

main.jsにおいて

// #ifdef VUE3
import { createSSRApp } from 'vue'
import App from './App.vue'

export function createApp() {
  const app = createSSRApp(App)
	app.config.globalProperties.$baseUrl = 'http://127.0.0.1:8000/'
	uni.addInterceptor('request', {
	  invoke(args) {
	    uni.showLoading({title: 'Loading', mask: true})
	  },
	  fail(err) {
	    uni.showToast({title: 'Error', icon: 'none'})
	  },
	  complete(res) {
	    uni.hideLoading()
	  }
	})

  return {
    app
  }
}
// #endif

uni.showLoading(OBJECT)

「Loading」プロンプト ボックスが表示される。プロンプト ボックスを閉じるには、「uni.hideLoading」 を呼び出す必要がある。

OBJECT説明

この記事が気に入ったらサポートをしてみませんか?