关于接口 api js文件 用接口 (form-model输入框input校验)

  • 先写一下api里面的js吧
    一般post的就是存一些数据给接口,接口本身可能也有数据
    一般get的就是通过关键字,拿接口里面的数据

我看见的文本


  • js里面
    因为需要把数据给接口,所以data:data 可以简写成data
export function changePassword(data) {
  return request({
    url: "/auth/changePassword",
    method: "post",
    data,
  });
}
export function userInfo(username) {

return request({

url: "/auth/userInfo/" + username,

method: "get",

});

}

在要调用接口的页面,根据路径先把对应的接口进行引入`

import { editUserInfo, userInfo, getCities } from "../../api/auth";

下面就是调接口

我这个是一个form-model页面,有输入框
在开头写了

<a-form-model
        class="light-form-wrapper"
        :rules="rules"
        :model="informationForm"
        ref="Form"
      >

这里调用表单

async preservation() {
      this.$refs.Form.validate(async (valid) => {
      -------------------------------------------这里就是input输入框的校验,valid是结果,全对就是true,否则就是false
        if (valid) {
          const res = await editUserInfo({
            email: this.informationForm.email,
            phone: this.informationForm.phone,
            nickname: this.informationForm.name,
            picture: this.imageUrlId,
            cityWeather: this.informationForm.cityWeather,
            id: sessionStorage.id,
        ------------------------------------------------------上面就是传递数据了
          });
          if (res.code === 200) {
            this.$message.success("保存成功");
            localStorage.nickname = this.informationForm.name;
            EventBus.$emit("renderHeader", this.informationForm.name);
            console.log(localStorage.nickname);
          }
        } else {
          return false;
        }
      });
    },
async getdata() {
      let that = this;
      if (localStorage.username) {
        const res = await userInfo(localStorage.username);
        if (res.code == 200) {
      ------------------------------------------这里是调用数据,res里面是拿到的数据,通过赋值显示到页面上
          console.log(res);
          that.informationForm.email = res.data.email;
          that.informationForm.phone = res.data.phone;
          that.informationForm.name = res.data.nickname;
          that.imageUrlId = res.data.picture;
          that.informationForm.cityWeather = res.data.cityWeather;
          sessionStorage.id = res.data.id;
        }
      }
    },
posted @ 2022-11-07 17:26  zongkm  阅读(50)  评论(0)    收藏  举报