vue.js 数据交互 ajax

最近刚学习了vue 遇到数据交互ajax提交数据，百度了一下 说的都好复杂 我来简化一下

首先安装axios或者直接下载axios.min.js文件 然后script引入 这里我们只讲安装引入的方法

 npm install axios -S  安装

在main.js中引入

import axios from 'axios'

Vue.prototype.$http = axios (********这句话很重要，放在上一句后面，不要放在new Vue中)
此时我们安装引入就完成了

在你需要进行操作的页面的methods里面声明一个方法来交互吧

methods:{
  init() {
    let url="../static/drink_list.json";
    this.$http.get(url) //这里的$http就是我们刚才引入进来的
      .then(res => {
        if (res.status === 200 && res.data.code == 200) {
          this.drinkArr = res.data.data;
        }
      })
      .catch(err => {
        console.log(err);
      })
  },

mounted(){
　　this.init();
}

 

到这里就完成啦！
仅供参考，如有错误敬请提出！
转载请注明出处！！！