vue?axios中的get請(qǐng)求方式
vue axios中的get請(qǐng)求
一、安裝
使用 npm:npm install axios
二、使用
步驟:1.引入 2.發(fā)送請(qǐng)求
<template> ? <div> ? ? <!-- 2.點(diǎn)擊發(fā)送請(qǐng)求 --> ? ? <button @click="getdata">get請(qǐng)求-無參數(shù)</button ? ? ><button @click="getDataByParams">get請(qǐng)求-有參數(shù)</button> ? </div> </template>
<script> //1.引入axios import axios from "axios"; export default { ? methods: { ? ? // 3.發(fā)送axios無參數(shù)請(qǐng)求 ? ? getdata() { ? ? ? axios ? ? ? ? // 3.1url地址 ? ? ? ? .get("http://157.122.54.189:9095/scenics/banners") ? ? ? ? // 3.2成功時(shí)回調(diào)函數(shù) ? ? ? ? .then((data) => { ? ? ? ? ? console.log(data); ? ? ? ? }) ? ? ? ? //3.3失敗時(shí)回調(diào)函數(shù) ? ? ? ? .catch((err) => { ? ? ? ? ? console.log(err); ? ? ? ? }); ? ? }, ? ? // 有參數(shù) ? ? getDataByParams() { ? ? ? axios ? ? ? ? //params:可傳遞多個(gè)參數(shù),固定寫法,不能改,否則參數(shù)傳遞失敗 ? ? ? ? .get("http://157.122.54.189:9095/posts", { params: { id: 4 } }) ? ? ? ? .then((data) => { ? ? ? ? ? console.log(data); ? ? ? ? }) ? ? ? ? .catch((err) => { ? ? ? ? ? console.log(err); ? ? ? ? }); ? ? }, ? }, }; </script>
<style> </style>
常見錯(cuò)誤
url后面不要寫冒號(hào),否則會(huì)結(jié)束。
vue axios post請(qǐng)求參數(shù)錯(cuò)誤400
如果直接把loginMode1當(dāng)請(qǐng)求參數(shù)傳,后端是接收不到的
要對(duì)loginMode1處理成字符串然后再轉(zhuǎn)換,如下
然后再axios處理
這樣就不會(huì)有問題了
以上為個(gè)人經(jīng)驗(yàn),希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
vue3中安裝使用vue-i18n實(shí)時(shí)切換語言且不用刷新
這篇文章主要介紹了vue3中安裝使用vue-i18n實(shí)時(shí)切換語言不用刷新問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-04-04vue3父子通信ref,toRef,toRefs使用實(shí)例詳解
這篇文章主要介紹了vue3父子通信ref,toRef,toRefs使用實(shí)例詳解,分別介紹了ref是什么、toRef是什么及toRefs是什么和最佳使用方式,結(jié)合示例代碼給大家講解的非常詳細(xì),需要的朋友可以參考下2023-10-10Vue微信項(xiàng)目按需授權(quán)登錄策略實(shí)踐思路詳解
這篇文章主要介紹了Vue微信項(xiàng)目按需授權(quán)登錄策略實(shí)踐思路詳解,本文給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-05-05總結(jié)4個(gè)方面優(yōu)化Vue項(xiàng)目
在本篇文章里我們給大家整理了一篇關(guān)于優(yōu)化VUE項(xiàng)目的四個(gè)總要點(diǎn),對(duì)此有需要的朋友們學(xué)習(xí)下天。2019-02-02vue雙擊事件2.0事件監(jiān)聽(點(diǎn)擊-雙擊-鼠標(biāo)事件)和事件修飾符操作
這篇文章主要介紹了vue雙擊事件2.0事件監(jiān)聽(點(diǎn)擊-雙擊-鼠標(biāo)事件)和事件修飾符操作,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2020-07-07vue父組件給子組件的組件傳值provide inject的方法
在本篇文章里小編給大家整理的是一篇關(guān)于vue父組件給子組件的組件傳值provide inject的方法,需要的朋友們學(xué)習(xí)下。2019-10-10Vue中的基礎(chǔ)過渡動(dòng)畫及實(shí)現(xiàn)原理解析
這篇文章主要介紹了Vue中的基礎(chǔ)過渡動(dòng)畫原理解析,需要的朋友可以參考下2018-12-12