axios怎么用?

2020-10-13  本文已影响0人  程序媛_

引入:

<!-- 开发环境版本,包含了有帮助的命令行警告 -->

<script src="https://cdn.jsdelivr.net/npm/vueldist/vue.js"></script>

【最好是使用第一种版本】

或者:

<!-- 生产环境版本,优化了尺寸和速度 -->

第一步:找到你要用得项目得根目录   

2:npm install axios 进行一个下载

 执行完后会发现uniapp和vue的项目一样,多了一个node_module文件夹,文件夹中多了一个axios文件夹,即安装成功。

3:

import Vue from 'vue'

import App from './App'import axios from 'axios'

// create an axios instance

const service = axios.create({

    baseURL: 'http://192.168.0.105:8090', // url = base url + request url

    withCredentials: true, // send cookies when cross-domain requests

    // timeout: 5000, // request timeout

    crossDomain: true

})

Vue.prototype.$axios = service

4.

import Vuefrom'vue'

export defaultVue.prototype.$axios

5.

axios.defaults.adapter = function(config) {

    return new Promise((resolve, reject) => {

        console.log(config)

        var settle = require('axios/lib/core/settle');

        var buildURL = require('axios/lib/helpers/buildURL');

        uni.request({

            method: config.method.toUpperCase(),

            url: config.baseURL + buildURL(config.url, config.params, config.paramsSerializer),

            header: config.headers,

            data: config.data,

            dataType: config.dataType,

            responseType: config.responseType,

            sslVerify: config.sslVerify,

            complete: function complete(response) {

                response = {

                    data: response.data,

                    status: response.statusCode,

                    errMsg: response.errMsg,

                    header: response.header,

                    config: config

                };

                settle(resolve, reject, response);

            }

        })

    })

}

关于axios在h5中做的一个demo

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

<title></title>

<style>

body {

background: url(img/1.png) no-repeat center center fixed;

background-size: 100%;

}

</style>

</head>

<body>

<input class="get" type="button" value="ni" />

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

<script>

document.querySelector(".get").onclick=function(){

axios.get("https://autumnfish.cn/api/joke").then(function(response){

console.log(response);

})

}

</script>

</body>

</html>

上一篇 下一篇

猜你喜欢

热点阅读