Vue学习（二）

1. Form方式提交Post

<script>
export default {
  data() {
    return {
      account: "",
      password: ""
    };
  },
  methods: {
    login() {
      let param = new FormData(); // 创建form对象
      param.append("account", this.account); // 通过append向form对象添加数据
      param.append("password", this.$md5(this.password)); // 添加form表单中其他数据
      // withCredentials: true //使得后台可以接收表单数据  跨域请求
      const instance = this.$axios.create({
        withCredentials: true
      });
      // url为后台接口
      instance
        .post("/user/login", param)
        .then(successResponse => {
          this.responseResult = JSON.stringify(successResponse.data);
          if (successResponse.data.code === 200) {
            this.$router.replace({ path: "/index" });
            alert("登陆成功!");
          }
        }) // 成功返回信息 调用函数  函数需自己定义，此处后面省略
      .catch(this.serverError); // 服务器错误 调用对应函数  函数需自己定义，此处后面省略
    }
  }
};

</script>

<style scoped>
</style>

2. json格式提交

//非Form提交、提交JSon
    this.$axios
      .post("/user/login", {
        account: this.account,
        password:this.$md5(this.password)
      })
      .then(successResponse => {
        this.responseResult = JSON.stringify(successResponse.data);
        if (successResponse.data.code === 200) {
          this.$router.replace({ path: "/index" });
          alert("登陆成功!")
        }
      })
      .catch(failResponse => {path:"/user/login",alert("登录失败！")});
  }
}