登录注册表单路由切换 - 登录注册开发入门(6)

登录注册表单路由切换 - 登录注册开发入门(6)

教程目标

完成注册表单的搭建,并实现与登录表单的无缝切换。

教程步骤

  1. 创建路由容器

    • 在页面中添加一个路由容器。
    • 路由容器需要与路由的页面容器配合使用。
  2. 添加页面组件

    • 在路由容器下方添加两个页面组件,分别命名为“登录页”和“注册页”。
    • 为每个页面设置对应的路径。
  3. 迁移登录卡片

    • 将原有的登录卡片拖动到登录页的容器内。
  4. 添加“去注册”按钮

    • 在登录页添加一个次按钮,并将其文本设置为“去注册”。
    • 设置按钮的宽度和上边距,优化布局。
  5. 复制登录卡片至注册页

    • 复制登录卡片,粘贴到注册页。
    • 将按钮文本修改为“去登录”。
  6. 绑定事件

    • 为“去注册”和“去登录”按钮分别绑定事件。
    • 选择页面跳转的动作节点,编辑页面路径,使其分别指向注册页和登录页。
  7. 测试

    • 测试按钮点击效果,确保“去注册”按钮能跳转到注册页,反之亦然。

下一步计划

  • 完成注册后台接口的逻辑开发。

注意事项

  • 确保所有步骤按照教程进行,若有疑问,请在评论区留言,将尽快得到解答。

通过以上步骤,您可以顺利地实现登录注册表单的路由切换。期待在后续课程中与您再见,共同学习更多AI应用开发的技巧。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/236051.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

普通虚拟主机如何安装SSL证书?

在今天的互联网世界中,保护网站数据安全和用户隐私已经成为了每个网站拥有者的重要任务。尽管安装SSL证书在普通虚拟主机环境中可能会有一些挑战,但通过正确的步骤和配置,您仍然可以为您的网站提供更高级别的安全保护。普通虚拟主机如何安装S…

DTC营销新模式,创新商业引领裂变营销新潮流的玩法!

DTC营销新模式,创新商业引领裂变营销新潮流的玩法! 随着市场竞争的加剧,企业寻求创新的营销模式以突破困境,脱颖而出。其中,DTC(Direct-to-Consumer,直接面向消费者)营销新模式应运…

【mysql】MySql中死锁是什么?怎么解决?

在MySQL中,死锁是指两个或多个事务相互等待对方持有的资源,导致它们无法继续执行并永远地被阻塞的情况。每个事务都持有一些资源,并且等待其他事务释放资源,但由于循环依赖关系,导致所有事务都无法继续执行,从而形成死锁。 当发生死锁时,MySQL会自动检测到它,并选择其…

CentOS 7 制作openssh 9.6 rpm包更新修复安全漏洞 —— 筑梦之路

2023年12月18日 openssh 发布新版9.6p1,详细内容阅读OpenSSH: Release Notes 背景说明 之前也写过多篇制作openssh rpm包的文章,为何要重新来写一篇制作openssh 9.6版本的? openssh 9.6 rpm包制作和之前存在区别,对于CentOS 7来…

spring之面向切面:AOP(2)

学习的最大理由是想摆脱平庸,早一天就多一份人生的精彩;迟一天就多一天平庸的困扰。各位小伙伴,如果您: 想系统/深入学习某技术知识点… 一个人摸索学习很难坚持,想组团高效学习… 想写博客但无从下手,急需…

【Python】函数

一、函数介绍 二、函数的定义 三、函数的参数 四、函数的返回值 五、函数说明文档 六、函数的嵌套调用 七、变量的作用域 一、函数介绍 函数的使用 函数的作用 函数 函数:是组织好的,可重复使用的,用来实现特定功能的代码段。 input()、p…

文件批量管理,按单值大小归类保存,提升工作效率与便捷性!

你是否曾经遇到过需要批量管理大量文件,但却因为文件大小不一而感到混乱?你是否希望有一种方法能够将这些文件按照单值大小进行归类保存,以便更方便地管理和查找?现在,我们有一个好消息要告诉你,我们推出了…

Nvm切换nodejs版本

下载地址 Releases coreybutler/nvm-windows GitHub 安装运行 双击安装运行即可 下载速度慢的,可以通过修改配置文件切换国内下载镜像 node_mirror: https://npm.taobao.org/mirrors/node/ npm_mirror: CNPM Binaries Mirror 打开安装目录,修改se…

【个人记录】Ubuntu做网络路由+强化学习项目debug

本篇并不介绍做整个项目的过程,仅仅是个人在科研过程中的debug记录和心得。希望某个部分是你正需要的解决方案。 第一部分:在服务器上安装mininet mininet是一个在安装过程中比较容易出问题的包。一定要好好看看官方INSTALL文档。Download/Get Started…

easyExcel生成excel并导出自定义样式------添加复杂表头

easyExcel生成excel并导出自定义样式------添加复杂表头 设置合并竖行单元格&#xff0c;表头设置 OutputStream outputStream ExcelUtils.getResponseOutputStream(response, fileName);//根据数据组装需要合并的单元格Map<String, List<String>> strategyMap …

gem5 garnet l1 l2 cache的创建与相连

gem5 garnet l1 l2 cache的创建与相连 主要就是这个图&#xff1a; 细节 我们用的是gem5/configs/deprecated/example/fs.py #fs.py 引入了上两层路径&#xff0c;也就是当前可以看到 gem5/configs/路径。 addToPath("../../")#fs.py引入了gem5/configs/ruby/Ru…

登录验证开发 - 登录注册开发入门(4)

AI应用开发入门10&#xff1a;登录验证功能低代码开发实战 引言 在本次教程中&#xff0c;我们将引导您通过使用低代码平台——多八多AI应用开发助手&#xff0c;完成一个登录验证功能的开发。这个功能能够接收用户的登录信息&#xff0c;并在后台进行验证&#xff0c;将结果返…

MaBatis使用`ResultMap`标签手动映射详解使用

文章目录 MaBatis使用ResultMap标签手动映射详解使用1、MyBatis只能自动维护库表”列名“与”属性名“相同时的对应关系&#xff0c;二者不同时无法自动ORM&#xff0c;如下&#xff1a;2、在SQL中使用 as 为查询字段添加列别名&#xff0c;以匹配属性名&#xff1a;但是如果我…

程序员为什么不接单赚钱?绝对是损失!!!

天气渐寒&#xff0c;2024年步步紧逼。 回望旧的2023年&#xff0c;生活有日益向好吗&#xff1f;身体是否还匹配年龄呢&#xff1f; 再问一个致命的问题&#xff1a;2023年攒的钱够多了吗&#xff1f; 如果差强人意&#xff0c;建议来年再改进。若是一言难尽&#xff0c;同样…

python 音视频合并

目录 moviepy ffmpeg命令合成&#xff1a; 添加字幕文件&#xff1a; 添加字幕文本&#xff1a; pipeline添加字幕&#xff1a; moviepy python&#xff08;opencv pyaudio moviepy&#xff09;实现录制音视频文件并合并_ubuntu使用python的sounddeviceopencv录制音视频…

分享一个好看的vs主题

最近发现了一个很好看的vs主题&#xff08;个人认为挺好看的&#xff09;&#xff0c;想要分享给大家。 主题的名字叫NightOwl&#xff0c;和vscode的主题颜色挺像的。操作方法也十分简单&#xff0c;首先我们先在最上面哪一行找到扩展。 然后点击管理扩展&#xff0c;再搜索栏…

Cmake学习笔记

1.linux下静态库包含静态库 使用qt在windows下是已经跑通过&#xff0c;但是在linux下一直没有成功。 测试发现linux可以实现.a连接.a的方案. 测试例子编译libtest1.a 和libtest2.a。libtest2.a中调用了libtest1.a 。最后在main.c中调用libtest2.a的函数。 配置环境变量文件…

ssm基于vue.js的连锁干洗店后台管理系统论文

摘 要 使用旧方法对连锁干洗店后台管理信息进行系统化管理已经不再让人们信赖了&#xff0c;把现在的网络信息技术运用在连锁干洗店后台管理信息的管理上面可以解决许多信息管理上面的难题&#xff0c;比如处理数据时间很长&#xff0c;数据存在错误不能及时纠正等问题。 这次…

JDBC的使用

目录 JDBC简介 JDBC的使用 JDBC简介 JDBC(Java DataBase Connectivity)是用Java操作数据库的一套API。 sun公司官方定义的一套操作所有关系型数据库的规范&#xff0c;即接口。各个数据库厂商去实现这套接口&#xff0c;提供数据库驱动jar包。我们可以使用这套接口(JDBC)来编…

在Docker中安装kafka遇到问题记录

命令含义解答&#xff1a; 在docker安装kafka的时候&#xff0c;启动kafka的时候会执行下面语句&#xff1a; docker run -d --log-driver json-file --log-opt max-size100m --log-opt max-file2 --name kafka -p 9092:9092 -e KAFKA_BROKER_ID0 -e KAFKA_ZOOKEEPER_CONNEC…