axios模拟GET请求实例及详解

1、在my-project项目中引入axios依赖：cnpm install --save axios

2、main.js 中引入 axios：
    // 在 main.js 中添加了这两行代码之后，就能直接在组件的 methods 中使用 $http命令
    import axios from 'axios'
    Vue.prototype.$http = axios
   （将 axios 改写为 Vue 的原型属性，只加第一条，有时候无法在其它的组件中使用 axios）

3、App.vue文件内容如下，当然你也可以在别的组件中调用
    <template>
        <div id="app">
            <img src="./assets/logo.png">
            {{ msg }}
            2、写一个按钮触发函数调起接口
            <a href="javascript:" v-on:click="get()">GET按钮</a>

         </div>
   </template>

<script>
  // 1、使用import导入axios，一定不要忘了先导入axios
  import axios from 'axios'

  export default {
      name: 'App',
  

      data () {
          return {
              title: '我去！！！',
              msg:'',
              apiurl: 'http://api/baidu.com/storage/?room=1'
          }
      },

       methods: {
          get: function() {
              axios.get("http://api/baidu.com/txcjapi/storage/", {
                  params: { room: '1'}
              }).then(res => {
                  this.msg = res.data
              })
              .catch((error) => {
                  this.msg = error
              })
       },

 }
</script>

<style>

</style>