axios之前端发送get与post请求模板

脚手架项目

根据提示可以安装axios模块

cnpm install axios -S

或者

npm install axios -S

代码中局部导入

项目中安装完成上述axios模块之后,在要使用axios的vue文件页面当中的script代码块导入axios依赖

import axios from "axios";

so,easy! Too Heapy

axios请求模板

官方文档:https://www.npmjs.com/package/axios;别看啦,我知道你赶时间😅

get请求模板

mounted() {
    axios
      .get(
        "/api/queryusertree?domId=" + this.domId + "&ownerId=" + this.ownerId,
        {
          headers: { Validate: "123456" }
        }
      )
      .then(response => {
     //注意response.data就已经是后端传过来的数据对象了,我之所以response.data.data是因为我的后端对象的一个属性字段叫做data
        let object = response.data.data;
        let head = object;
        this.data = object.childList;
        console.log(this.data);
      })
      .catch(error => {
        console.log(error);
        alert("网络错误,不能访问");
      });
  },

post请求模板

remove(userId) {
      let data = {
        domId: this.domId,
        ownerId: this.ownerId,
        userId: userId
      };//post传递对象到后台

      axios
        .post("/api/removedomuser", data, {
          headers: {
            //头部信息
            "Content-Type": "application/json;charset=utf-8",
            Validate: "123456" 
          }
        })
        .then(response => {
          let resultUtils = response.data;
          console.log(resultUtils);
        })
        .catch(error => {
          console.log(error);
          alert("网络错误,不能访问");
        });
    },

 

posted @ 2019-11-30 19:55  liuyanntes'cnblogs  阅读(1898)  评论(0编辑  收藏  举报