update vue3

pages/register.vue

@@ -35,80 +35,78 @@
   </view>
 </template>
 
-<script>
+<script setup>
   import { getCodeImg, register } from '@/api/login'
+  import { ref, getCurrentInstance } from "vue"
 
-  export default {
-    data() {
-      return {
-        codeUrl: "",
-        captchaEnabled: true,
-        globalConfig: getApp().globalData.config,
-        registerForm: {
-          username: "",
-          password: "",
-          confirmPassword: "",
-          code: "",
-          uuid: ""
-        }
-      }
-    },
-    created() {
-      this.getCode()
-    },
-    methods: {
-      // 用户登录
-      handleUserLogin() {
-        this.$tab.navigateTo(`/pages/login`)
-      },
-      // 获取图形验证码
-      getCode() {
-        getCodeImg().then(res => {
-          this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled
-          if (this.captchaEnabled) {
-            this.codeUrl = 'data:image/gif;base64,' + res.img
-            this.registerForm.uuid = res.uuid
-          }
-        })
-      },
-      // 注册方法
-      async handleRegister() {
-        if (this.registerForm.username === "") {
-          this.$modal.msgError("请输入您的账号")
-        } else if (this.registerForm.password === "") {
-          this.$modal.msgError("请输入您的密码")
-        } else if (this.registerForm.confirmPassword === "") {
-          this.$modal.msgError("请再次输入您的密码")
-        } else if (this.registerForm.password !== this.registerForm.confirmPassword) {
-          this.$modal.msgError("两次输入的密码不一致")
-        } else if (this.registerForm.code === "" && this.captchaEnabled) {
-          this.$modal.msgError("请输入验证码")
-        } else {
-          this.$modal.loading("注册中，请耐心等待...")
-          this.register()
-        }
-      },
-      // 用户注册
-      async register() {
-        register(this.registerForm).then(res => {
-          this.$modal.closeLoading()
-          uni.showModal({
-          	title: "系统提示",
-          	content: "恭喜你，您的账号 " + this.registerForm.username + " 注册成功！",
-          	success: function (res) {
-          		if (res.confirm) {
-                uni.redirectTo({ url: `/pages/login` });
-          		}
-          	}
-          })
-        }).catch(() => {
-          if (this.captchaEnabled) {
-            this.getCode()
-          }
-        })
+  const { proxy } = getCurrentInstance()
+  const globalConfig = getApp().globalData.config
+  const codeUrl = ref("")
+  // 验证码开关
+  const captchaEnabled = ref(true)
+  const registerForm = ref({
+    username: "",
+    password: "",
+    confirmPassword: "",
+    code: "",
+    uuid: ""
+  })
+
+  // 用户登录
+  function handleUserLogin() {
+    proxy.$tab.navigateTo(`/pages/login`)
+  }
+
+  // 获取图形验证码
+  function getCode() {
+    getCodeImg().then(res => {
+      captchaEnabled.value = res.captchaEnabled === undefined ? true : res.captchaEnabled
+        if (captchaEnabled.value) {
+          codeUrl.value = 'data:image/gif;base64,' + res.img
+          registerForm.value.uuid = res.uuid
       }
+    })
+  }
+
+  // 注册方法
+  async function handleRegister() {
+    if (registerForm.value.username === "") {
+      proxy.$modal.msgError("请输入您的账号")
+    } else if (registerForm.value.password === "") {
+      proxy.$modal.msgError("请输入您的密码")
+    } else if (registerForm.value.confirmPassword === "") {
+      proxy.$modal.msgError("请再次输入您的密码")
+    } else if (registerForm.value.password !== registerForm.value.confirmPassword) {
+      proxy.$modal.msgError("两次输入的密码不一致")
+    } else if (registerForm.value.code === "" && captchaEnabled.value) {
+      proxy.$modal.msgError("请输入验证码")
+    } else {
+      proxy.$modal.loading("注册中，请耐心等待...")
+      userRegister()
     }
   }
+
+  // 用户注册
+  async function userRegister() {
+    register(registerForm.value).then(res => {
+      proxy.$modal.closeLoading()
+      uni.showModal({
+        title: "系统提示",
+        content: "恭喜你，您的账号 " + registerForm.value.username + " 注册成功！",
+        success: function (res) {
+          if (res.confirm) {
+            uni.redirectTo({ url: `/pages/login` })
+          }
+        }
+      })
+    }).catch(() => {
+      if (captchaEnabled.value) {
+        getCode()
+      }
+    })
+  }
+
+  getCode()
 </script>
 
 <style lang="scss" scoped>
@@ -185,5 +183,4 @@
       }
     }
   }
-
 </style>