vue.js配置axios

Heier 發(fā)布于2019-08-22 11:16 / 1367人閱讀

摘要：首先用安裝安裝完之后，在你的文件里配置，加上這兩句就好然后你讀取接口數(shù)據(jù)的時(shí)候，直接就可以這樣寫(xiě)，這個(gè)跟一個(gè)樣，我那個(gè)下面的，之類的都是要傳的參數(shù)。如果接口走成功就執(zhí)行這里接口失敗，也就是不是的時(shí)候，走這里好了，搞定

官方現(xiàn)在已經(jīng)不再推薦用resource了，換了個(gè)axios，咱也不能落后，至少你得知道咋弄，面試的時(shí)候也好給面試官吹吹牛逼，廢話不多說(shuō)。
首先用npm安裝

npm install --save axios vue-axios

安裝完之后，在你的main.js文件里配置，加上這兩句就好

import axios from "axios"
Vue.prototype.$http = axios

然后你讀取接口數(shù)據(jù)的時(shí)候，直接就可以這樣寫(xiě)，這個(gè)跟resource一個(gè)樣，我那個(gè)下面的op，uin之類的都是要傳的參數(shù)。

this.$http.post(localStorage.getItem("addUrl")+"/skynet_sync/btsp", {
                            "op": "update_card_num",
                            "uin": uin,
                            "protypeId": index,            
                            "cardNumber": parseInt(v)
                        })
                      .then(response=> {
                        //如果接口走成功就執(zhí)行這里

                      }).catch(function (error) {
                        //接口失敗，也就是state不是200的時(shí)候，走這里
                      });

好了，搞定！

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

轉(zhuǎn)載請(qǐng)注明本文地址：http://hztianpu.com/yun/92064.html

相關(guān)文章

axios異步請(qǐng)求數(shù)據(jù)的簡(jiǎn)單使用

摘要：使用模擬好后端數(shù)據(jù)之后模擬數(shù)據(jù)的使用參考，就需要嘗試請(qǐng)求加載數(shù)據(jù)了。數(shù)據(jù)請(qǐng)求選擇了，現(xiàn)在都推薦使用。規(guī)定要發(fā)送到服務(wù)器的數(shù)據(jù)。布爾值，表示請(qǐng)求是否異步處理。要求為類型的參數(shù)，請(qǐng)求成功后調(diào)用的回調(diào)函數(shù)。在一個(gè)中重寫(xiě)回調(diào)函數(shù)的字符串。使用Mock模擬好后端數(shù)據(jù)之后（Mock模擬數(shù)據(jù)的使用參考：https://segmentfault.com/a/11...），就需要嘗試請(qǐng)求加載數(shù)據(jù)了。數(shù)...

forsigner 2019-08-23 14:40 評(píng)論0 收藏0
Vue入坑筆記

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

superw 2019-08-26 12:16 評(píng)論0 收藏0
服務(wù)端預(yù)渲染之Nuxt(路由篇)

摘要：前面既然說(shuō)到了會(huì)把文件夾下面的所有文件編譯成路由，那么子路由需要使用文件夾嵌套才行?？蛻舳耸状卧L問(wèn)的頁(yè)面會(huì)在服務(wù)端做輸出，一旦渲染完成之后，則不會(huì)再在服務(wù)端輸出，則會(huì)一直在客戶端進(jìn)行輸出了。服務(wù)端預(yù)渲染之Nuxt - 使用現(xiàn)在大多數(shù)開(kāi)發(fā)都是基于Vue或者React開(kāi)發(fā)的，能夠達(dá)到快速開(kāi)發(fā)的效果，也有一些不足的地方,Nuxt能夠在服務(wù)端做出渲染，然后讓搜索引擎在爬取數(shù)據(jù)的時(shí)候能夠讀到...

yuanxin 2019-08-23 16:48 評(píng)論0 收藏0
vue開(kāi)發(fā)看這篇文章就夠了

摘要：注意此處獲取的數(shù)據(jù)是更新后的數(shù)據(jù)，但是獲取頁(yè)面中的元素是更新之前的鉤子函數(shù)說(shuō)明組件已經(jīng)更新，所以你現(xiàn)在可以執(zhí)行依賴于的操作。鉤子函數(shù)說(shuō)明實(shí)例銷毀 Vue -漸進(jìn)式JavaScript框架介紹 vue 中文網(wǎng) vue github Vue.js 是一套構(gòu)建用戶界面(UI)的漸進(jìn)式JavaScript框架庫(kù)和框架的區(qū)別我們所說(shuō)的前端框架與庫(kù)的區(qū)別？ Library 庫(kù)，本質(zhì)上是一...

fsmStudy 2019-08-21 18:37 評(píng)論0 收藏0
Nuxt.js 基礎(chǔ)入門教程

摘要：原文鏈接開(kāi)發(fā)一個(gè)單頁(yè)面應(yīng)用，相信很多前端工程師都已經(jīng)學(xué)會(huì)了，但是單頁(yè)面應(yīng)用有一個(gè)致命的缺點(diǎn)，就是極不友好?；谒?，我們可以快速開(kāi)發(fā)一個(gè)基于的單頁(yè)面應(yīng)用。只有數(shù)據(jù)流存在相關(guān)配置時(shí)可用。引入后，所有頁(yè)面均有效。原文鏈接 Vue 開(kāi)發(fā)一個(gè)單頁(yè)面應(yīng)用，相信很多前端工程師都已經(jīng)學(xué)會(huì)了，但是單頁(yè)面應(yīng)用有一個(gè)致命的缺點(diǎn)，就是 SEO 極不友好。除非，vue 能在服務(wù)端渲染（ssr）并直接返回已經(jīng)渲...

yedf 2019-08-26 11:37 評(píng)論0 收藏0