niesen
/
thinkphp6-template


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
							<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <!-- import CSS -->
    <link
      rel="stylesheet"
      href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"
    />
  </head>
  <body>
    <div id="app">
      <el-card style="width: 800px">
        <el-form>
          <el-form-item label="Username">
            <el-input v-model="form.username"></el-input>
          </el-form-item>
          <el-form-item label="Password">
            <el-input
              type="password"
              v-model="form.password"
              autocomplete="off"
            ></el-input>
          </el-form-item>
          <el-form-item label="Avatar">
            <el-input type="text" v-model="form.avatar"></el-input>
          </el-form-item>
          <el-form-item label="Email">
            <el-input type="text" v-model="form.email"></el-input>
          </el-form-item>
          <el-form-item label="Captcha">
            <br />
            <div style="display: flex">
              <el-input type="text" v-model="form.captcha"></el-input>
              <img
                src="https://api.danjiwanjia.com/user/getRegisterCaptchaImage"
                alt="Captcha"
              />
            </div>
          </el-form-item>
          <el-form-item>
            <el-button @click="submitForm">Submit</el-button>
          </el-form-item>
        </el-form>
      </el-card>
    </div>
  </body>
  <!-- import Vue before Element -->
  <script src="https://unpkg.com/vue@2/dist/vue.js"></script>
  <!-- import JavaScript -->
  <script src="https://unpkg.com/element-ui/lib/index.js"></script>
  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
  <script>
    let v = new Vue({
      el: "#app",
      data() {
        return {
          form: {
            username: "",
            password: "",
            avatar: "",
            email: "",
            captcha: "",
          },
        };
      },
      methods: {
        submitForm() {
          axios
            .post("https://api.danjiwanjia.com/user/register", this.form)
            .then((response) => {
              console.log("Registration successful:", response.data);
            })
            .catch((error) => {
              console.error("Registration failed:", error);
            });
        },
      },
    });
  </script>
</html>