跳转语法uni.switchTab({
url: '/pages/index/index'
});
login.vue代码
<template><!-- 自定义导航栏 --><NavBar></NavBar><view class="login_a"><view class="login_w"><view class="login_s"><view class="login_x"><uni-forms ref="form" :modelValue="formData"><uni-forms-item label="用户" name="name"><uni-easyinput type="text" v-model="formData.name" placeholder="请输入账号或手机号" /></uni-forms-item><uni-forms-item label="密码" name="password"><uni-easyinput type="password" v-model="formData.password" placeholder="请输入密码" /></uni-forms-item><!-- 我已阅读 --><uni-forms-item label=""><uni-data-checkbox v-model="formData.hobby" multiple :localdata="formData.hobbys" /></uni-forms-item><button @click="submitForm" type="primary" >登录</button><!-- 记住密码 --><uni-forms-item label="" ><uni-data-checkbox v-model="formData.recall" multiple :localdata="formData.recalls" /></uni-forms-item></uni-forms></view></view></view></view>
</template><script setup lang="ts">import NavBar from "../components/navBar/navBar.vue";import { reactive } from 'vue';import { useRouter } from 'vue-router';const router = useRouter();const formData = reactive({name: 'xptyn',password: '12345',hobby: [5],hobbys: [{ "value": 0, "text": "我已阅读并同意《服务协议》和《隐私政策》" },],recall: [5],recalls: [{ "value": 0, "text": "记住密码" },],});const submitForm = () => {// 检查用户名和密码是否为空if (!formData.name || !formData.password) {console.log('用户名和密码不能为空');return;}// 检查“我已阅读并同意《服务协议》和《隐私政策》”是否选中if (!formData.hobby.includes(0)) {uni.showModal({title: '提示',content: '请阅读并同意《服务协议》和《隐私政策》',showCancel: false});return;}// 登录逻辑,假设登录成功console.log('表单数据信息:', formData);uni.switchTab({url: '/pages/index/index'});};// 我已阅读const change = (e) => {console.log('e:', e);};
</script><style lang="scss" scoped>@import "/static/css/login.css";@import '@/uni_modules/uni-scss/index.scss';
</style>
login.css
.login_q{width: 100%;height: 400rpx;position: relative; /* 设置相对定位 */}.login_z{width: 100%;height: 80rpx;background-color: #fff;position: absolute; /* 设置绝对定位 */top: 424rpx; /* 定位到顶部 */border-radius: 40rpx 40rpx 0rpx 0rpx;}.login_w{width: 100%;height: 800rpx;display: flex;justify-content: center;}.login_s{width: 90%;height: 800rpx;}.tit_q{display: flex;justify-content: center;font-size: 46rpx;}.login_x{margin-top: 40rpx;}