在vue中使用jsonp跨域访问数据

1.首先在src目录下建立一个api目录，下面建立cofing.js和recommend.js文件，在config.js文件中是一些跨域访问的参数：

export const commonParams = {
    source: 'wap' //访问时的公共参数
}
export const options = {
    param: 'callback'
}
export const ERR_OK = 0;  //访问成功时的状态码

2.在recommend.js下：

import jsonp from '../common/js/jsonp';
import { commonParams, options } from './config';

export function getRecommend() {
    const url = 'http://www.yinyuetai.com/mv/get-bigpic'; //跨域请求的地址

    const data = Object.assign({}, commonParams, {
        platfrom: 'h5'
    });

    return jsonp(url, data, options);
}

3.在webpack.base.conf.js文件中配置文档入口（module.export中的resolve的alias中配置）：

'api': resolve('src/api')

4.在需要使用数据的组件中（recommend.vue）：

<script>
import {getRecommend} from '../../api/recommend';
import {ERR_OK} from '../../api/config'
export default {
    created() {
      this._getRecommend();
    },
    methods: {
      _getRecommend() {
        getRecommend().then((res) => {
          console.log(res.bigPics);
        });
      }
    }
}
</script>