使用 ajaxRequest.js 时，往接口传参

ajaxRequest.js 是对 Axios 的封装，在使用 ajaxRequest.js 的时候，需要往接口传参。分为get 和 post。

先在 main.js 中全局使用 qs

main.js:

// 全局使用 qs
import qs from 'qs'
Vue.prototype.$qs = qs

1. post

api/common_pay.js：

import axios from '../utils/ajaxRequest'

// 短信验证码 POST
export const fastPaySms = (data) => {
    return axios.request({
        url: '/web/trades/fast-pay-sms',
        method: 'post',
        data: data,
        dataType: 'JSON',
        withCredentials: true
    })
}

在组件中调取接口：

views/order_details_tabs/order_details_tabs.vue:

export default {
    mounted() {
        let data = this.$qs.stringify({
            bindCardNo: '201090710152645'
        })
        
        // 短信验证码
        fastPaySms(data).then(data => {
            console.log(data)
        },err => {
            
        })
    }
}

2. get

(1) 第一种方式，对 url 进行拼接

api/common_pay.js：

import axios from '../utils/ajaxRequest'

// 快捷支付 GET
// http://localhost:8080/web/trades/pay-submit?payWayCode=FastPay&smsCode=123456&bindCardNo=312313123
export const paySubmit = (payWayCode, smsCode, bindCardNo) => {
    return axios.request({
        url: '/web/trades/pay-submit?payWayCode='
 + payWayCode + '&smsCode=' + smsCode + '&bindCardNo=' + bindCardNo,
        method: 'get',
        dataType: 'JSON',
        withCredentials: true
    })
}

在组件中调取接口：

views/order_details_tabs/order_details_tabs.vue:

export default {
    methods: {
        // 确认付款
        submit () {
            let my_payWayCode = 'B2C'
            let my_smsCode = '123456'
            let my_bindCardNo = '312313123'
            // 调用接口
            paySubmit(my_payWayCode, my_smsCode, my_bindCardNo).then(data => {
                console.log(data)
            }, err => {
                
            })
        }
    }
}

(2) 第二种方式，使用 params

api/common_pay.js：

import axios from '../utils/ajaxRequest'

// 快捷支付 GET
export const paySubmit = (data) => {
    return axios.request({
        url: '/web/trades/pay-submit',
        method: 'get',
        params: data,
        dataType: 'JSON',
        withCredentials: true
    })
}

在组件中调取接口：

views/order_details_tabs/order_details_tabs.vue:

export default {
    methods: {
        // 确认付款
        submit () {
            
            let data = {
                payWayCode: 'FastPay',
                smsCode: '123456',
                bindCardNo: '201090710152645'
            }
            
            // 调用接口
            paySubmit(data).then(data => {
                console.log(data)
            }, err => {
                
            })
        }
    }
}