【vue】安装axios 使用axios 与使用axios中遇到的一些问题

最新推荐文章于 2023-11-05 14:53:54 发布

肉肉Rose

最新推荐文章于 2023-11-05 14:53:54 发布

阅读量1k

点赞数 3

文章标签： html

本文链接：https://blog.csdn.net/CeciliaXinn/article/details/120368853

版权

一、安装axios

cnpm install axios -s

cnpm install vue-axios --save

在这里插入图片描述

vue add axios

在这里插入图片描述

二、问题axios

安装完axios后出现了无法找到element-ui的包

在这里插入图片描述

然后看了下node_modules文件夹里面么有element-ui的文件
重新安装了一次element

在这里插入图片描述

最后
在这里插入图片描述

使用axios

main.js

import Vue from 'vue'
import App from './App'
import router from './router'

import axios from 'axios'

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';

import Vuetify from 'vuetify'
import vuetify from '@/plugins/vuetify'


Vue.prototype.$axios = axios ;

Vue.use(ElementUI);
Vue.use(Vuetify);
Vue.config.productionTip = false



/* eslint-disable no-new */
new Vue({
  vuetify,
  
  el: '#app',
  router,
  render: h => h(App)
})

Con.vue

<template>

  <input type="text" name="" id="" v-model="query" @keyup.enter="searchMusic" />


</template>

<script>
import axios from 'axios'

export default {
  data() {
    return {
      query: "dd",
      musicList: [],
    };
  },
  methods: {
    searchMusic: function () {
      axios.get("https://autumnfish.cn/search?keywords=" + this.query).then(
        function (re) {
          console.log(re);
        },
        function (err) {
          console.log(err);
        }
      );
    },
    
  },
};
</script>

<style>
</style>