一、axios(推荐)

1、安装依赖

yarn add xios

2、发送请求

//main.js
import axios from 'axios'
axios.defaults.baseURL = 'https://music.aityp.com';
Vue.prototype.axios = axios;

data(){
    return {
        playlists:[]
    }
},
mounted(){
  this.axios.get("/top/playlist?cat=华语").then(res=>{
      this.playlists = res.data.playlists;
  })
}

3、渲染页面

<div v-for="(item,index) of playlists" :key="item.id" >
   ...
</div>

二、axios-jsonp-pro

1、安装依赖

npm i axios-jsonp-pro -S

2、引入+获取数据

import axios from 'axios-jsonp-pro';
mounted(){
    var url = "https://douban.uieee.com/v2/movie/top250";
    axios.jsonp(url).then(res=>{
        this.movies = res.subjects;
    })
}

3、渲染页面

<-- 在vue中属性要使用变量要在前面加冒号: -->

<template>
    <div id="app">
      <div class="item" v-for="item of movies" :key="item.id">
        <p>{{item.title}}</p>
      <-- 在vue中属性要使用变量要在前面加冒号: -->
      <img :src="item.images.small" alt="">
        </div>
  </div>
</template>