vue中使用mock

1、安装mock

npm install mockjs --save-dev

在package.json里面看到 "mockjs": "^1.0.1-beta3"这块代码，说明mockjs已经引入载入成功

2、在src目录下创建mock.js文件

3、mock.js文件内容如下：

import Mock from 'mockjs'

let getList = Mock.mock('/api/getList', 'get', (options) => {

  let listImg = [

    {

      url: 'http://y.gtimg.cn/music/common/upload/MUSIC_FOCUS/290077.jpg'

    }, {

      url: 'http://y.gtimg.cn/music/common/upload/MUSIC_FOCUS/289416.jpeg'

    }, {

      url: 'http://y.gtimg.cn/music/common/upload/MUSIC_FOCUS/290256.jpg'

    }

  ]

  let data = {

    body: {

      listImg: listImg

    },

    meta: {

      code: 200,

      message: '获取成功'

    }

  }

  return data

})

export default{

  getList

}

4、在main.js文件中加入

import './mock.js'

5、在musicHall.vue文件中，使用axios

axios({

      url: '/api/getList',

      headers: {

        'Content-Type': 'application/json'

      }

    })

      .then(function (res) {

        console.log(res.data.body.listImg)

        console.log(vm.listImg)

        vm.listImg = res.data.body.listImg

      })

      .catch(function (rej) {

        console.log(rej)

      })