VAADIN-按钮|在HTML布局脚本中实现 [英] VAADIN - Button | implement in HTML Layout-Script

问题描述

在HTML脚本中是否有使用Vaadin按钮的机会？

is there any oportnunity to use a Vaadin Button in a HTML script?

Id喜欢使用以下按钮

Id like to use the following button

Button button_login = ew Button();
button_login.setID("buttonlogin");

此按钮应在以下脚本中实现

and this button should be implement in the following script

<div data-location="buttonlogin"></div>

（仅一个主意）

有所以。将按钮绑定到html脚本中的想法？

Have so. an idea to bind the button in the html script?

谢谢！

推荐答案

我不太确定 html脚本是什么意思。如果您可以使用JavaScript来实现，那么请尝试一下。

I am quite unsure what you mean by html script. If it is something you can achieve using JavaScript then here is my try.

通常在单击按钮时执行JavaScript

Generally to execute JavaScript on button click

Button js = new Button("Do JavaScript");
js.addClickListener( click -> { 
   com.vaadin.ui.JavaScript.getCurrent().execute("alert(´Hello´)");
 });

需要使用外部 .js 时文件，例如 hello.js ，以下内容

When in need to use external .js files, for example hello.js, contents below

function hello() {
   alert("Hello JavaScriptWorld!");
}

假设 hello.js 直接位于 / VAADIN / 目录下，将以下注释添加到您的 UI 或相关组件类

Assuming hello.js is directly under /VAADIN/ directory, add following annotation to your UI or relevant component class

@JavaScript({"vaadin://hello.js"}) // all paths must be relative to /VAADIN

然后在 ClickListener 中可以引用函数hello（）如

com.vaadin.ui.JavaScript.getCurrent().execute("hello()");

这篇关于VAADIN-按钮|在HTML布局脚本中实现的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！