vue/cli3 配置 axios

环境同引入element-ui一样

  • vue 2.6.11

  • vue/cli 3.11.0

  • elementui vue脚手架自动安装2.4.5

1. 安装axios插件

vue add axios

2. main.js变化

import Vue from 'vue'
//这一行是新增的代码
import './plugins/axios'
import App from './App.vue'
import router from './router'
import store from './store'
import './plugins/element.js'

Vue.config.productionTip = false

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app')

注意:第三行代码是新增的,表示引入axios,这里是全局导入,在本项目任何地方都可以使用

3. 使用axios

<script>
export default {
  name: "Users",
  components: {},
  data() {
    return {
      tableData: []
    };
  },
  created() {
    axios
      .post("http://localhost:8989/user/ListByParam", {
        pageNum: "1",
        pageSize: "5"
      })
      .then((response) => {
        console.log(response);
        this.tableData = response.data.data.records;
      })
      .catch((error) => {
        console.log(error);
      });
  }
};
</script>
上一篇:Vue CLI 学习


下一篇:vue-cli3路由vue-router用法