2.vue2.0 jsonp封装

1.页面简介+轮播图数据分析

在webpack.base.conf中配置

alias: {
  'vue$': 'vue/dist/vue.esm.js',
  '@': resolve('src'),
  'common': resolve('src/common'),
  'components': resolve('src/components'),
  'base': resolve('src/base'),
  'api': resolve('src/api')
}

2.JSONP原理介绍+P封装

代码实现：

jsonp.js

import originJsonp from 'jsonp'

export default function jsonp(url, data, option) {
  url += (url.indexOf('?') < 0 ? '?' : '&') + param(data)

  return new Promise((resolve, reject) => {
    originJsonp(url, option, (err, data) => {
      if (!err) {
        resolve(data)
      } else {
        reject(err)
      }
    })
  })
}

export function param(data) {
  let url = ''
  for (var k in data) {
    let value = data[k] !== undefined ? data[k] : ''
    url += '&' + k + '=' + encodeURIComponent(value)
  }
  return url ? url.substring(1) : ''
}

import jsonp from 'common/js/jsonp'
import {commonParams, options} from './config'//组件里面是传递数据
import axios from 'axios'

export function getRecommend() {
  const url = ''

  const data = Object.assign({}, commonParams, {
  
  })

  return jsonp(url, data, options)
}