uniapp在項目靜態(tài)資源中配置接口地址

  1. 先在項目靜態(tài)資源文件夾static下創(chuàng)建一個config.json文件


    圖片.png

  2. 在config.json文件中設(shè)置要配置的url地址


    圖片.png

  3. 然后可以通過兩種方式來實現(xiàn)
    a. 在項目非靜態(tài)資源文件夾中創(chuàng)建一個js文件


    圖片.png

    通過xhr來請求出json中的數(shù)據(jù)

// 定義配置變量
let config
 // 定義同步獲取json文件數(shù)據(jù)方法
 let syncGetJsonData = function (url) {
      let xhr = new XMLHttpRequest()
      xhr.open('get', url, false)
      xhr.send()
     return JSON.parse(xhr.responseText)
  }

config = syncGetJsonData('./static/json/config.json?r=' + Math.random())

export default config

然后再main.js中引入，掛載到Vue.prototype上


圖片.png

b. 另一種方式就是直接main.js中去請求config.json的數(shù)據(jù)，然后掛載到Vue.prototype上，同時把Vue實例也放在請求返回結(jié)果中（request.request是我自己封裝的請求方法，替換成自己的或者axios就行）

request.request({
    url: './static/json/config.json',
   method: 'GET'
}).then(res => {
Vue.prototype.$urllist = res.data;

App.mpType = 'app'

const app = new Vue({
    ...App
})
app.$mount()
})
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容