node.js中的后台数据请求mock，axios

Posted 2020-11-28

<!-- axios 处理cross跨域 后台配置好的
1.安装 cnpm install --save-dev axios

2.引入axios 到项目 或者组件(仅限当前组件使用)
-->
    // 使用axios 请求
Axios.get("/getuser")
  .then(res => {
    //succss
    console.log(res.data.result);
  })
  .catch(error => {
    //error
    console.log(error);
  })
  .finally(() => {
    console.log("最后执行的操作");
  });

Axios.post("/gettable")
  .then(res => {
    //succss
    console.log(res.data.result);
  })
  .catch(error => {
    //error
    console.log(error);
  })
  .finally(() => {
    console.log("最后执行的操作");
  });

//例如get后台的api接收参数
// Axios.get("http://www/maodou.com/getdata?id=1&name=zhangsnan")
//   .then(res => {
//     //succss
//     console.log(res);
//   })
//   .catch(error => {
//     //error
//     console.log(error);
//   })
//   .finally(() => {
//     console.log("最后执行的操作");
//   });
// Axios.get("", {
//   params: {
//     id: 1,
//     name: "张三"
//   }
// })
//   .then(res => {
//     //succss
//     console.log(res);
//   })
//   .catch(error => {
//     //error
//     console.log(error);
//   })
//   .finally(() => {
//     console.log("最后执行的操作");
//   });
//例如post后台的api接收参数
// Axios.post("", {
//   id: 1,
//   name: "张三"
// })
//   .then(res => {
//     //succss
//     console.log(res);
//   })
//   .catch(error => {
//     //error
//     console.log(error);
//   })
//   .finally(() => {
//     console.log("最后执行的操作");
//   });

//因为axios  返回的是一个promise 对象 
//就可以使用es6  async
// async function (){

// }

     computed: {
//计算属性
//computed  里面可以写复杂的逻辑
//  里面也可以写  getter  setter
// getData() {
//   console.log("计算属性里面的方法");
// },
getData: {
  get() {
    //getter
    return this.num1 * this.num2;
  },
  set(newValue) {
    //setter
    this.num1 = newValue;
    this.num2 = newValue / 10;
  }
},
changeStatus() {
  console.log("在事件执行的方法里面调用");
}

},
watch: {
// watch 监听属性 或者 是 watch 监听组件上的数据变化的
//watch 监听里面写的监听方法和 变量同名 同能才能监听到变量的变化
msg(afterValue, beforeValue) {
console.log(afterValue, beforeValue);
}
},
beforeCreate() {},
created() {},
beforeMount() {},
mounted() {
//在挂载完成之后去执行
//computed 里面的方法在调用的时候不需要添加括号执行
//this.getData; //属性
this.getData = 100;
console.log(this.getData);
},
beforeUpdate() {},
updated() {},
beforeDestroy() {},
destroyed() {}
};

<!-- vue-resource 插件
1.cnpm install --save-dev vue-resource 安装
2.配置项目使用 mainjs

  vue  项目使用mockjs 模拟后台数据
  1.安装  cnpm install mockjs  --save-dev
  2.配置mockjs模拟数据的文件
  3.引入mock 到vue项目 去mainjs
-->