1. 什么是 axios伶唯?
Axios 是一個基于 promise 的 HTTP 庫鸠项,可以用在瀏覽器和 node.js 中抹剩。
2. axios 學(xué)習(xí)資源
axios中文網(wǎng):http://www.axios-js.com
github倉庫地址:https://github.com/axios/axios
3. 使用示例
<script src="https://unpkg.com/axios/dist/axios.min.js"></script><script>
axios.get('http://127.0.0.1/1.php')
.then(res=>{
// 接口數(shù)據(jù)
console.log(res.data)
})</script>
4. 發(fā)送get請求布持,攜帶參數(shù)
**請求參數(shù)屬性: params: {} **
axios.get('http://127.0.0.1/1.php',?{
params:?{
id:?1,
name:?'liang'
}}).then(res=>{
// 接口數(shù)據(jù)
console.log(res.data)})
5. 發(fā)送post請求余境,攜帶參數(shù)
參數(shù)直接作為axios.post()?的第二個參數(shù)庶骄,而不像get請求需要寫在 params 中
axios.post('http://127.0.0.1/1.php',?{
id:?1,
name:?'liang'}).then(res=>{
console.log(res.data)})
特別注意:PHP則需要使用以下方式接收POST數(shù)據(jù) $_POST是接收不到的
file_get_contents('php://input');
解決方案:使用Qs處理下數(shù)據(jù)毁渗,此時(shí)PHP可以使用$_POST接收到參數(shù)了
在bootcdn搜索qs,引入qs的cdn单刁,使用 Qs.stringify 處理數(shù)據(jù)
<script src="https://unpkg.com/axios/dist/axios.min.js"></script><!-- 引入 qs 在bootcdn搜索qs --><script src="https://cdn.bootcdn.net/ajax/libs/qs/6.9.4/qs.min.js"></script><script>
axios.post('http://127.0.0.1/1.php',?Qs.stringify({
id:?1,
name:?'liang'
}))
.then(res=>{
console.log(res.data)
})</script>
6. axios 全能型
get
axios({
url:?'http://127.0.0.1/1.php',
method:?'get',
params:?{id:?1}}).then(res =>?{
console.log(res.data)})
post
axios({
url:?'http://127.0.0.1/1.php',
method:?'post',
data:?Qs.stringify({id:?1})}).then(res =>?{
console.log(res.data)})
7. xm-select
推薦一個下拉多選的插件灸异,該插件文檔中的示例,也是使用的axios
xm-select:https://gitee.com/maplemei/xm-select