原生js axios请求方式

引入 axios

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

get请求

    //默认请求为get
    axios('http://localhost:5000/Test/g1')
        .then(function (response) {
            console.log(response.data)
        }).catch(function (err) {
            console.log(err)
        });




    //无参数，
    axios.get('http://localhost:5000/Test/g1' )
        .then(function (response) {
            console.log(response.data)
        }).catch(function (err) {
            console.log(err)
        });

    //无参数,传对象
    axios({
        url:'http://localhost:5000/Test/g1',
        method:'get'
        })
        .then(function (response) {
            console.log(response.data)
        }).catch(function (err) {
            console.log(err)
        });

    //url上带参请求 
    axios({
        url: 'http://localhost:5000/Test/g2?a=3&str=abc',
        method: 'get'
    })
        .then(function (response) {
            console.log(response.data)
        }).catch(function (err) {
            console.log(err)
        });

    //带参
    axios({
        url: 'http://localhost:5000/Test/g2',
        method: 'get',
        //params是URL拼接
        params: {
            a: 3,
            str: 'abc'
        }
    })
        .then(function (response) {
            console.log(response.data)
        }).catch(function (err) {
            console.log(err)
        });

    //参数是集合
    axios({
        url: 'http://localhost:5000/Test/g4',
        method: 'get',
        data: [{ "age": 18, "name": "tom" }, { "age": 22, "name": "liu" }]
    })
        .then(function (response) {
            console.log(response.data)
        }).catch(function (err) {
            console.log(err)
        });

Post

    //无参数
    axios.post('http://localhost:5000/Test/p1')
        .then(function (response) {
            console.log(response.data)
        }).catch(function (err) {
            console.log(err)
        });

    //传对象
    axios({
        url: 'http://localhost:5000/Test/p3',
        method: 'post',
        data: {
            age: 18,
            name: 'tom',
            id: 1
        }
    })
        .then(function (response) {
            console.log(response.data)
        }).catch(function (err) {
            console.log(err)
        });

    //数组
    axios({
        url: 'http://localhost:5000/Test/p4',
        method: 'post',
        data: ["ab", "cd"]
    })
        .then(function (response) {
            console.log(response.data)
        }).catch(function (err) {
            console.log(err)
        });

    //传集合对象
    axios({
        url: 'http://localhost:5000/Test/p5',
        method: 'post',
        data: [{ "age": 18, "name": "tom" }, { "age": 22, "name": "liu" }]
    })
        .then(function (response) {
            console.log(response.data)
        }).catch(function (err) {
            console.log(err)
        });

    //传对象和URL参数混合
    axios({
        url: 'http://localhost:5000/Test/p6',
        method: 'post',
        params: { a: 'aaaa', b: 'bbbb' },
        data: [{ "age": 18, "name": "tom" }, { "age": 22, "name": "liu" }]
    })
        .then(function (response) {
            console.log(response.data)
        }).catch(function (err) {
            console.log(err)
        });

    //dynamic 对象
    axios({
        url: 'http://localhost:5000/Test/p7',
        method: 'post',
        data: { "age": 18, "name": "tom" }
    })
        .then(function (response) {
            console.log(response.data)
        }).catch(function (err) {
            console.log(err)
        });

    //dynamic 数组对象
    axios({
        url: 'http://localhost:5000/Test/p7',
        method: 'post',
        data: [{ "age": 18, "name": "tom" }, { "age": 22, "name": "liu" }]
    })
        .then(function (response) {
            console.log(response.data)
        }).catch(function (err) {
            console.log(err)
        });