[Vue]# 前后端分离 4：前端 GET 传参

# 前后端分离 4：前端 GET 传参


> Author： ZeXu  


> Soft: WebStorm  
>
> 前期准备：  
>
>   1. some()
>   2. Object.prototype.toString.call(对象/数组) || '[object Object]'  '[object Array]'


> 在 '前后端分离 2：传参' 与 '前后端分离 3：前端 API.js'中，分别写到 get 有无参数的请求 axios ，而且现在我们也有了 api.js
>
> 在 api.js 中, 需要考虑到 不同的 get 请求需要不同的 参数，可能有的后台接口不需要传参，有的需要
>
> 因此我们必须让这个参数是根据请求的参数来传参的


    ``` javascript
        // # api.js > function API () { let get... }
        let get = (url, params) => {
            if (params) {
                url = url + '?'
                let keys = Object.keys(params)
                for (let i = 0; i < keys.length; i++) {
                    if (['[object Object]', '[object Array]'].some(item => Object.prototype.toString.call(params[keys]) === item)) {
                        params[keys = JSON.stringify(parasm[keys])
                    }
                    url += keys + '=' + 'params[keys]' + (i === keys.length - 1 ? '' : '&')
                }
            }
            
            return to(new Promise((reslove, reject) => {
                axios.get(url)
                    .then(response => {
                        reslove(response.data)
                    })
                    .catch(error => {
                        reject(error)
                    })
            }))
        }
        
        this.product = {
            getMethod (params) {
              return get('/product', params)
            }
        }
        
        export default new API()
    ```  
    
>


    ``` javascript
        // # news.vue
        async mounted () {
            let params = {name: '123', value: [{id: 'q'}, {id: 'w'}, {id: 'e'}, {id: 'r'}]}
            let [err, res] = await API.product.getMethod(params)
            console.log('get：', err, res)
        }
    ```