uniapp登录注册功能实现代码

UniApp 提供了一套完整的用户认证解决方案，包括登录注册功能。以下是一个简化的示例代码，使用了 UniApp 的内置 `u-form` 和 `u-login` 组件：

<!-- login.vue -->
<template>
  <view>
    <u-login ref="login" @login="handleLogin" placeholder="请输入手机号/邮箱和密码"></u-login>
    <view v-if="showRegister">
      <button @click="showRegister = false">已有账号？登录</button>
      <u-form @submit="handleRegister" :model="registerForm" style="margin-top: 20px;">
        <u-input-item prop="username" placeholder="用户名"></u-input-item>
        <u-input-item prop="password" type="password" placeholder="密码"></u-input-item>
        <u-button type="primary" @click.stop>注册</u-button>
      </u-form>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      showRegister: false,
      registerForm: {
        username: '',
        password: ''
      }
    };
  },
  methods: {
    handleLogin(e) {
      // 处理登录请求，比如调用后台接口
      this.$http.post('/api/login', e.detail).then(res => {
        // 登录成功后，跳转到其他页面或设置全局登录状态
      });
    },
    handleRegister(e) {
      // 处理注册请求，同样调用后台接口
      this.$http.post('/api/register', this.registerForm).then(() => {
        // 注册成功后，提示用户并可能返回登录页面
        this.showRegister = false;
        this.$message.success('注册成功，请登录');
      });
    }
  }
};
</script>

注意，这只是一个基础示例，实际开发中还需要处理错误处理、密码加密、用户状态管理等细节，并且需要配合后端服务器完成身份验证。此外，`u-login` 和 `u-form` 需要在项目中安装相应的插件。