亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

在vue項(xiàng)目中的axios使用配置記錄

Magicer / 1133人閱讀

摘要:默認(rèn)項(xiàng)目中已經(jīng)安裝,基于開發(fā),主要記錄配置的相關(guān)。響應(yīng)時(shí)間配置配置請(qǐng)求頭靜態(tài)資源配置接口地址傳參序列化添加請(qǐng)求攔截器數(shù)據(jù)加載中,請(qǐng)稍后請(qǐng)求錯(cuò)誤返回狀態(tài)判斷添加響應(yīng)攔截器請(qǐng)求失敗,請(qǐng)稍后再試發(fā)送請(qǐng)求配置組件內(nèi)部的調(diào)用

默認(rèn)vue項(xiàng)目中已經(jīng)安裝axios,基于element-ui開發(fā),主要記錄配置的相關(guān)。

axiosConfig.js
import Vue from "vue"
import axios from "axios"
import qs from "qs"
import { Message, Loading } from "element-ui"
// 響應(yīng)時(shí)間
axios.defaults.timeout = 5 * 1000
// 配置cookie
// axios.defaults.withCredentials = true
// 配置請(qǐng)求頭
axios.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded;charset=UTF-8"
// 靜態(tài)資源
Vue.prototype.$static = ""

// 配置接口地址
axios.defaults.baseURL = ""
var loadingInstance
// POST傳參序列化(添加請(qǐng)求攔截器)
axios.interceptors.request.use(
  config => {
    loadingInstance = Loading.service({
      lock: true,
      text: "數(shù)據(jù)加載中,請(qǐng)稍后...",
      spinner: "el-icon-loading",
      background: "rgba(0, 0, 0, 0.7)"
    })
    if (config.method === "post") {
      config.data = qs.stringify(config.data)
    }
    return config
  },
  err => {
    loadingInstance.close()
    Message.error("請(qǐng)求錯(cuò)誤")
    return Promise.reject(err)
  }
)
// 返回狀態(tài)判斷(添加響應(yīng)攔截器)
axios.interceptors.response.use(
  res => {
    if (res.data.code === 200) {
      loadingInstance.close()
      return res
    } else {
      loadingInstance.close()
      Message.error(res.data.msg)
    }
  },
  err => {
    loadingInstance.close()
    Message.error("請(qǐng)求失敗,請(qǐng)稍后再試")
    return Promise.reject(err)
  }
)
// 發(fā)送請(qǐng)求
export function fetchPost (url, params) {
  return new Promise((resolve, reject) => {
    axios
      .post(url, params)
      .then(
        res => {
          resolve(res.data)
        },
        err => {
          reject(err.data)
        }
      )
      .catch(err => {
        reject(err.data)
      })
  })
}
export function fetchGet (url, params) {
  return new Promise((resolve, reject) => {
    axios
      .get(url, {
        params: params
      })
      .then(res => {
        resolve(res.data)
      })
      .catch(err => {
        reject(err.data)
      })
  })
}
main.js 配置
import { fetchGet, fetchPost} from "./api/axiosConfig"
Vue.prototype.$get = fetchGet
Vue.prototype.$post = fetchPost
組件內(nèi)部的調(diào)用
getData () {
  let params = {
    userId: this.userId
  }
  this.$get("/xxx", params).then(res => {
    this.listsData = res.data
  }).catch(() => {
  })
}

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://www.ezyhdfw.cn/yun/93114.html

相關(guān)文章

  • Vue入坑筆記

    摘要:近段時(shí)間常使用開發(fā),寫點(diǎn)記錄,避免時(shí)間久之忘了。安裝教程查看是否已安裝,在中輸入若已安裝則輸出版本號(hào)。繼承報(bào)錯(cuò)可能是文件路徑問(wèn)題。當(dāng)和繼承的不同時(shí)在文件夾內(nèi)外的話,會(huì)出現(xiàn)該錯(cuò)誤。 近段時(shí)間常使用vue-cli開發(fā),寫點(diǎn)記錄,避免時(shí)間久之忘了。 環(huán)境 1. nodejs  vue-cli開發(fā)基于nodejs環(huán)境,確保開發(fā)的環(huán)境中已安裝了nodejs?! “惭b教程 https://www....

    superw 評(píng)論0 收藏0
  • node-vue前后端分離記錄

    摘要:用于列表渲染,可以循環(huán)遍歷數(shù)組和對(duì)象注意目前指的是的迭代事件綁定,簡(jiǎn)寫相當(dāng)于與相比,避免了閃現(xiàn)的問(wèn)題。 node vue項(xiàng)目開發(fā) 看了近一周的vue開發(fā),有諸多感觸,我之前接觸過(guò)react、angular所以特別想學(xué)學(xué)久仰大名的vue。學(xué)習(xí)半天以后發(fā)現(xiàn),接觸到的東西多了,學(xué)習(xí)起來(lái)就是容易很多,vue的指令我能個(gè)聯(lián)想到angular的指令,vue組件化設(shè)計(jì)類似于react的組件化設(shè)計(jì),包...

    lowett 評(píng)論0 收藏0
  • vue+node+mysql搭建個(gè)人博客(一)

    摘要:其中用來(lái)完成請(qǐng)求,將添加的原型上后就不需要再在每個(gè)需要使用它的頁(yè)面引入了每個(gè)頁(yè)面都相當(dāng)于一個(gè)組件,文件以結(jié)尾,第一次啟動(dòng)成功時(shí)看到的頁(yè)面就是組件,路徑。 學(xué)習(xí)筆記...在線地址:cl8023.com github 數(shù)據(jù)庫(kù)已改為mongodb 快速搭建 node 后端服務(wù)Github-quick-node-server 準(zhǔn)備工作 安裝node,這是必須的 新版node自帶npm...

    peixn 評(píng)論0 收藏0
  • 基于vue項(xiàng)目的知識(shí)總結(jié)

    摘要:前言用有一段時(shí)間了,從用搭建項(xiàng)目一步步配置,到之后的研究動(dòng)效這些,一直想寫些東西記錄一下做個(gè)總結(jié),剛好趁著有空就整理一下。結(jié)語(yǔ)有新的知識(shí)點(diǎn)會(huì)更新到知識(shí)體系中,總結(jié)和心得體會(huì)會(huì)單獨(dú)寫文章詳述,努力填坑 前言 用vue有一段時(shí)間了,從用vue-cli搭建項(xiàng)目、一步步配置axios、vuex、vue-router,到之后的研究canvas、動(dòng)效這些,一直想寫些東西記錄一下、做個(gè)總結(jié),剛好趁著...

    tianlai 評(píng)論0 收藏0
  • vue 項(xiàng)目總結(jié)一文件夾結(jié)構(gòu)配置

    摘要:文件夾結(jié)構(gòu)文件夾里的文件夾設(shè)置是靈活的,可以根據(jù)自己的習(xí)慣進(jìn)行,不必雷同。對(duì)文件夾配置的總結(jié)先到此為止,下一篇文章會(huì)是對(duì)文件夾里具體文件的配置和例子總結(jié),有需要的可以去看看。 之前一段時(shí)間都在使用 vue 開發(fā)后臺(tái)管理系統(tǒng),在摸索的過(guò)程中對(duì) vue 本身和模塊化、規(guī)范化開發(fā)有了更深的認(rèn)知,現(xiàn)在記錄下來(lái),希望對(duì)其他需要開發(fā)項(xiàng)目的人有幫助。 項(xiàng)目配置 首先,在確定好使用的框架和組件庫(kù)后,先...

    spacewander 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

Magicer

|高級(jí)講師

TA的文章

閱讀更多
最新活動(dòng)
閱讀需要支付1元查看
<