首页 理论教育 Java服务端研发:页面逻辑添加

Java服务端研发:页面逻辑添加

时间:2023-11-22 理论教育 版权反馈
【摘要】:现在虽然已经可以绘制简单的页面了,但是这种页面明显与实现基本的业务逻辑相差甚远。下面给程序添加页面和数据交互的逻辑,让页面变得更有意义。添加页面映射Controller类方法添加页面数据模型此数据结构用来承载页面输入的数据。页面展示通过以上的配置,可以根据模板映射和模板页面的实现,在浏览器中显示实际的前端页面。图7-10 用户信息输入页面图7-11 输入用户信息点击“创建”后,显示的页面内容如图7-12所示。

Java服务端研发:页面逻辑添加

现在虽然已经可以绘制简单的页面了,但是这种页面明显与实现基本的业务逻辑相差甚远。下面给程序添加页面和数据交互的逻辑,让页面变得更有意义。

设计一个页面,可以通过输入框输入用户信息,然后提交给后台程序。

(1)添加输入页面模板

添加页面模板createuser.html,把页面输入数据的部分放入form中,并且通过action标记数据处理的方法,这个方法会在submit时被调用。

978-7-111-61011-3-Part02-161.jpg

(2)添加页面映射Controller类方法

978-7-111-61011-3-Part02-162.jpg

(3)添加页面数据模型

数据结构用来承载页面输入的数据。

978-7-111-61011-3-Part02-163.jpg

978-7-111-61011-3-Part02-164.jpg

(4)页面展示

通过以上的配置,可以根据模板映射和模板页面的实现,在浏览器中显示实际的前端页面。如图7-10所示。

(5)添加数据交互

根据上面的页面进行输入,但是输入后的数据由谁来承接呢?这就需要提供一个接口,用来承接页面数据。

978-7-111-61011-3-Part02-165.jpg

以上为承接页面数据的接口。然后编写一个save.html模板页面把toString生成的数据显示出来,具体如下。

<html xmlns:th="http://www.thymeleaf.org">

<head>(www.xing528.com)

<title>welcome spring boot</title>

<meta http-equiv="Content-Type"content="text/html;charset=UTF-8"/>

</head>

<body>

<label style="font-size:18px;display:block"th:text="${info}"></label>

</body>

</html>

(6)页面显示

在创建用户的页面输入一些User信息,如图7-11所示,然后观察save页面的显示。

978-7-111-61011-3-Part02-166.jpg

图7-10 用户信息输入页面

978-7-111-61011-3-Part02-167.jpg

图7-11 输入用户信息

点击“创建”后,显示的页面内容如图7-12所示。

现在虽然可以在后台程序接收前台页面的输入了,但是这么直白地显示出来好像也没有什么意义,而且一旦程序退出,之前输入的数据也会丢失,所以需要把数据持久化。

978-7-111-61011-3-Part02-168.jpg

图7-12 保存结果页面

免责声明:以上内容源自网络,版权归原作者所有,如有侵犯您的原创版权请告知,我们将尽快删除相关内容。

我要反馈