vue快速入门六（elementUI登录，注册,axios使用

<template>
  <div id="app">
    <el-form ref="loginForm" :model="loginForm" label-width="80px">
      <el-form-item label="账号">
        <el-input v-model="loginForm.username" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="密码">
        <el-input type="password" v-model="loginForm.password" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="login">登录</el-button>
        <el-button @click="resetLoginForm">重置</el-button>
      </el-form-item>
    </el-form>
    <!-- 注册表单 -->
    <el-form ref="registerForm" :model="registerForm" label-width="80px">
      <el-form-item label="账号">
        <el-input v-model="registerForm.username" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="密码">
        <el-input type="password" v-model="registerForm.password" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="确认密码">
        <el-input type="password" v-model="registerForm.confirmPassword" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="success" @click="register">注册</el-button>
        <el-button @click="resetRegisterForm">重置</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
 
<script>
import axios from 'axios';
 
export default {
  name: 'App',
  data() {
    return {
      loginForm: {
        username: '',
        password: ''
      },
      registerForm: {
        username: '',
        password: '',
        confirmPassword: ''
      }
    };
  },
  methods: {
    login() {
      axios.post('/api/login', this.loginForm)
        .then(response => {
          console.log(response.data);
          // 处理登录成功的逻辑
        })
        .catch(error => {
          console.error(error);
          // 处理登录失败的逻辑
        });
    },
    register() {
      if (this.registerForm.password !== this.registerForm.confirmPassword) {
        alert('密码与确认密码不一致！');
        return;
      }
      axios.post('/api/register', this.registerForm)
        .then(response => {
          console.log(response.data);
          // 处理注册成功的逻辑
        })
        .catch(error => {
          console.error(error);
          // 处理注册失败的