@Kacie 2022-05-23 16:21 采纳率: 100%
浏览 352
已结题

vue中用axios发post请求500

请求接口
登录
地址:http://47.243.33.127:8021/member/login
请求方式:post请求
需要参数: username password

img

点击登录
运行结果报错

<template>
  <div class="mine">
    <div class="info" v-show="isLogin">
      <h2>开始学习前端</h2>
      <p>学无止境</p>
      <br/>
      <mt-button type="danger" @click='toLogin'>登录</mt-button>
      <mt-button type="primary" @click='toRegister'>注册</mt-button>
      <p>登录注册即代表你同意《用户协议》和《隐私政策》</p>
      <br/>
    </div>
    <div class="login" v-show="!isLogin">
      <h2>用户登录</h2>
      <br/>
      <ul>
        <li>
          <h4>用户名:</h4>
          <input type="text" placeholder="请输入用户名" v-model="username" />
        </li>
        <li>
          <h4>密 码:</h4>
          <input type="password" placeholder="请输入密码" v-model="password" />
        </li>
      </ul>
    <mt-button type="danger" @click='login'>登录</mt-button>
  </div>
  </div>
</template>

<script>
// import qs from 'qs'
export default {
  name: 'MineView',
  data () {
    return {
      username: 'dsf',
      password: '12sdf3456ds',
      isLogin: 'true'
    }
  },
  methods: {
    toLogin () {
      this.isLogin = !this.isLogin
    },
    toRegister () {

    },
    login () {
      const json = { username: this.username, password: this.password }
      this.$axios.post('http://47.243.33.127:8021/member/login', JSON.stringify(json)).then(function (message) {
        console.log(message)
      }).catch((err) => {
        console.log(err)
      })
    }
  }
}
</script>

<style scoped>
.mine{
  height: 85vh;
  display: flex;
  justify-content: center;
  align-content: center;
}
.info{
  margin: auto;
  background-color: #fff;
  height: 300px;
  width: 80%;
  padding: 30px;
  border-radius: 10px;
  box-shadow: 0px 2px 5px #afafaf;
  text-align: center;
}
p{
  margin: 10px;
}
.mint-button{
  margin: 15px auto;
  width: 100%;
}
h2{
  text-align: center;
}
.login{
  margin: auto;
  background-color: #fff;
  height: 300px;
  width: 80%;
  padding: 30px;
  border-radius: 10px;
  box-shadow: 0px 2px 5px #afafaf;
}
li{
  margin: 10px auto;
  list-style: none;
}
input {
  margin: 5px auto;
  height: 25px;
  width: 95%;
  border: 2px solid rgb(97, 97, 97);
  border-radius: 5px;
  padding: 5px;
  color: black;
}
</style>


img

  • 写回答

3条回答 默认 最新

  • 你好!机器人 2022-05-23 16:35
    关注
    
    login () {
            const json = { username: this.username, password: this.password }
            this.$axios.post('http://47.243.33.127:8021/member/login', json).then(function (message) {
              console.log(message)
            }).catch((err) => {
              console.log(err)
            })
          }
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(2条)

报告相同问题?

问题事件

  • 已结题 (查看结题原因) 5月28日
  • 已采纳回答 5月23日
  • 创建了问题 5月23日

悬赏问题

  • ¥15 metadata提取的PDF元数据,如何转换为一个Excel
  • ¥15 关于arduino编程toCharArray()函数的使用
  • ¥100 vc++混合CEF采用CLR方式编译报错
  • ¥15 coze 的插件输入飞书多维表格 app_token 后一直显示错误,如何解决?
  • ¥15 vite+vue3+plyr播放本地public文件夹下视频无法加载
  • ¥15 c#逐行读取txt文本,但是每一行里面数据之间空格数量不同
  • ¥50 如何openEuler 22.03上安装配置drbd
  • ¥20 ING91680C BLE5.3 芯片怎么实现串口收发数据
  • ¥15 无线连接树莓派,无法执行update,如何解决?(相关搜索:软件下载)
  • ¥15 Windows11, backspace, enter, space键失灵