java web mvc-07-Vaadin 入门介绍

2024-01-24 11:20
文章标签 java 入门 介绍 web mvc 07 vaadin

本文主要是介绍java web mvc-07-Vaadin 入门介绍,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

拓展阅读

Spring Web MVC-00-重学 mvc

mvc-01-Model-View-Controller 概览

web mvc-03-JFinal

web mvc-04-Apache Wicket

web mvc-05-JSF JavaServer Faces

web mvc-06-play framework intro

web mvc-07-Vaadin

web mvc-08-Grails

开源

The jdbc pool for java.(java 手写 jdbc 数据库连接池实现)

The simple mybatis.(手写简易版 mybatis)

Vaadin Flow 快速入门

需求

添加代码

运行应用程序

Vaadin Flow 可以帮助您快速构建纯 Java 的 Web 应用程序,无需编写任何 HTML 或 JavaScript。本指南演示了如何使用 Vaadin Flow 构建一个小型但完全功能的 ToDo 应用程序。

需求

首先,您需要 JDK 17 或更高版本(例如 Eclipse Temurin JDK)。接下来,您需要下载快速入门项目。您可以通过点击这里的按钮进行下载:

https://start.vaadin.com/dl?preset=flow-quickstart-tutorial

完成下载后,请将下载的ZIP文件解压到本地文件夹中。然后将项目导入到一个集成开发环境(IDE)中。

添加代码

接下来,您将添加代码。

打开位于 src/main/java/com/example/application/views/main/ 目录下的 MainView.java 文件。

用以下代码替换该文件中的代码:

package com.example.application.views.main;import com.vaadin.flow.component.Key;
import com.vaadin.flow.component.button.Button;
import com.vaadin.flow.component.checkbox.Checkbox;
import com.vaadin.flow.component.html.H1;
import com.vaadin.flow.component.orderedlayout.HorizontalLayout;
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
import com.vaadin.flow.component.textfield.TextField;
import com.vaadin.flow.router.Route;@Route("") 
public class MainView extends VerticalLayout { public MainView() {VerticalLayout todosList = new VerticalLayout(); TextField taskField = new TextField(); Button addButton = new Button("Add"); addButton.addClickListener(click -> { Checkbox checkbox = new Checkbox(taskField.getValue());todosList.add(checkbox);});addButton.addClickShortcut(Key.ENTER); add( new H1("Vaadin Todo"),todosList,new HorizontalLayout(taskField,addButton));}
}

@Route 注解使得该视图对终端用户可访问,在这种情况下,使用了空的 "" 路由。

由于 MainView 类扩展了 VerticalLayout,因此添加到其中的组件按垂直顺序排列。

todosList 是一个垂直布局,显示任务列表以及复选框。

taskField 是一个文本输入字段,用于输入新任务的描述。

addButton 是一个用于添加新任务的按钮。

在按钮点击的监听器中,首先创建一个新的复选框,其标签为来自 taskField 的值。然后将复选框添加到 todosList 中。

addButton 组件添加一个快捷键,当按下 Enter 键时触发。

调用 VerticalLayout 上的 add() 方法以垂直方式显示这些组件。请注意,taskFieldaddButton 位于一个 HorizontalLayout 中,这使它们并排显示。

运行应用程序

到目前为止,您所做的可能看起来并不多,但已足以运行应用程序。

在您的 IDE 中运行它,启动位于 src/main/java/org/vaadin/example 目录下的 Application.java。

或者,您可以在命令行中运行该项目,输入以下命令:

  • 在 macOS 或 Linux 系统上输入 ./mvnw
  • 在 Windows 系统上输入 mvnw

然后,在浏览器中打开 localhost:8080。您应该会看到以下内容:

[外链图片转存中…(img-9zLTjq9x-1706024506586)]

在这里插入图片描述

这篇关于java web mvc-07-Vaadin 入门介绍的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/639539

相关文章

Java实现检查多个时间段是否有重合

《Java实现检查多个时间段是否有重合》这篇文章主要为大家详细介绍了如何使用Java实现检查多个时间段是否有重合,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录流程概述步骤详解China编程步骤1:定义时间段类步骤2:添加时间段步骤3:检查时间段是否有重合步骤4:输出结果示例代码结语作

Java中String字符串使用避坑指南

《Java中String字符串使用避坑指南》Java中的String字符串是我们日常编程中用得最多的类之一,看似简单的String使用,却隐藏着不少“坑”,如果不注意,可能会导致性能问题、意外的错误容... 目录8个避坑点如下:1. 字符串的不可变性:每次修改都创建新对象2. 使用 == 比较字符串,陷阱满

Java判断多个时间段是否重合的方法小结

《Java判断多个时间段是否重合的方法小结》这篇文章主要为大家详细介绍了Java中判断多个时间段是否重合的方法,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录判断多个时间段是否有间隔判断时间段集合是否与某时间段重合判断多个时间段是否有间隔实体类内容public class D

IDEA编译报错“java: 常量字符串过长”的原因及解决方法

《IDEA编译报错“java:常量字符串过长”的原因及解决方法》今天在开发过程中,由于尝试将一个文件的Base64字符串设置为常量,结果导致IDEA编译的时候出现了如下报错java:常量字符串过长,... 目录一、问题描述二、问题原因2.1 理论角度2.2 源码角度三、解决方案解决方案①:StringBui

Java覆盖第三方jar包中的某一个类的实现方法

《Java覆盖第三方jar包中的某一个类的实现方法》在我们日常的开发中,经常需要使用第三方的jar包,有时候我们会发现第三方的jar包中的某一个类有问题,或者我们需要定制化修改其中的逻辑,那么应该如何... 目录一、需求描述二、示例描述三、操作步骤四、验证结果五、实现原理一、需求描述需求描述如下:需要在

Java中ArrayList和LinkedList有什么区别举例详解

《Java中ArrayList和LinkedList有什么区别举例详解》:本文主要介绍Java中ArrayList和LinkedList区别的相关资料,包括数据结构特性、核心操作性能、内存与GC影... 目录一、底层数据结构二、核心操作性能对比三、内存与 GC 影响四、扩容机制五、线程安全与并发方案六、工程

JavaScript中的reduce方法执行过程、使用场景及进阶用法

《JavaScript中的reduce方法执行过程、使用场景及进阶用法》:本文主要介绍JavaScript中的reduce方法执行过程、使用场景及进阶用法的相关资料,reduce是JavaScri... 目录1. 什么是reduce2. reduce语法2.1 语法2.2 参数说明3. reduce执行过程

如何使用Java实现请求deepseek

《如何使用Java实现请求deepseek》这篇文章主要为大家详细介绍了如何使用Java实现请求deepseek功能,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录1.deepseek的api创建2.Java实现请求deepseek2.1 pom文件2.2 json转化文件2.2

Java调用DeepSeek API的最佳实践及详细代码示例

《Java调用DeepSeekAPI的最佳实践及详细代码示例》:本文主要介绍如何使用Java调用DeepSeekAPI,包括获取API密钥、添加HTTP客户端依赖、创建HTTP请求、处理响应、... 目录1. 获取API密钥2. 添加HTTP客户端依赖3. 创建HTTP请求4. 处理响应5. 错误处理6.

Spring AI集成DeepSeek的详细步骤

《SpringAI集成DeepSeek的详细步骤》DeepSeek作为一款卓越的国产AI模型,越来越多的公司考虑在自己的应用中集成,对于Java应用来说,我们可以借助SpringAI集成DeepSe... 目录DeepSeek 介绍Spring AI 是什么?1、环境准备2、构建项目2.1、pom依赖2.2