如何在 vaadin 中设置 autocomplete="off"答案

【问题标题】：How to set autocomplete="off" in vaadin如何在 vaadin 中设置 autocomplete="off"
【发布时间】：2014-12-29 20:22:57
【问题描述】：

是否可以在Vaadin 7 的TextField 上设置HTML5 属性autocomplete="off"？我已经搜索过，但找不到在文本字段上设置属性的方法，或者只是提示浏览器在 vaadin 中以其他方式禁用输入字段的本机自动完成功能。

【问题讨论】：

标签： vaadin

【解决方案1】：

我认为唯一的方法是使用 javascript：

TextField tf = new TextField();
tf.addStyleName("xyz");
JavaScript.getCurrent().execute(
    "document.getElementsByClassName('xyz')[0].setAttribute('autocomplete', 'off')");

【讨论】：

嗨 Krayo，我刚刚添加了这个，它可以工作，但是当我刷新页面时它会关闭，有什么解决方案吗？

【解决方案2】：

扩展文本域...

package com.example;
import com.vaadin.ui.TextField;

public class MyTextField extends TextField {
   // do other customization here  as needed
}

...还有 - 这里的关键点是什么 - 它的客户端连接器

package com.example.client;

import com.vaadin.client.ui.VTextField;
import com.vaadin.client.ui.textfield.TextFieldConnector;
import com.vaadin.shared.ui.Connect;

@Connect(com.example.MyTextField.class)
public class MyTextFieldConnector extends TextFieldConnector {

   @Override
   public VTextField getWidget() {
      VTextField vTextField = super.getWidget();
      vTextField.getElement().setAttribute("autocomplete","off");
      return vTextField;
   }

}

不要忘记重新编译小部件集。

【讨论】：

我不再在 Vaadin 项目上工作以确认它是否有效。如果某个第三方确认，我会将此答案设置为已接受，因为这将是我在 Java 中而不是 JavaScript 中的首选方式

【解决方案3】：

如果您使用Viritin add-on，您现在可以使用 HtmlElementPropertySetter 类来包装您的 TextField 组件并使用它将“自动完成”元素属性设置为“关闭”。您也可以使用 Viritin 附带的 MTextField 组件，并按如下方式创建它：

MTextField username = new MTextField("Username")
        .withAutocompleteOff();

【讨论】：

【解决方案4】：

这是对@Wojciech Marciniak 答案的扩展。他的方法对我有用，但我想指出我必须进行几三处修改才能使其在 2017 年 11 月 28 日生效。

1) autocomplete="off" 现在似乎不再工作了；至少不在 Chrome 上。相反，您可以使用 autocomplete="new-password"，它适用于 Chrome 62.0.3202.94 Windows 64 位。我还注意到此属性的一些不一致行为，因为并非总是有效 - 有时会在组件上显示一个包含密码选项的列表（特别是在您刷新几次之前等）。

2a) 您可能希望通过在项目中创建 com.vaadin.client.ui.(component)field 包来覆盖它，而不是扩展组件，然后将修改后的 (component)FieldConnector.java 文件放入其中（在我的情况下，我正在修改 PasswordField）如果您希望此组件的所有实例都不记得密码。最终的类源应该是这样的：

package com.vaadin.client.ui.passwordfield;

import com.vaadin.client.ui.VPasswordField;
import com.vaadin.client.ui.textfield.TextFieldConnector;
import com.vaadin.shared.ui.Connect;
import com.vaadin.ui.PasswordField;

@Connect(PasswordField.class)
public class PasswordFieldConnector extends TextFieldConnector {

    @Override
    public VPasswordField getWidget() {
        VPasswordField vTextField = (VPasswordField) super.getWidget();
        vTextField.getElement().setAttribute("autocomplete","new-password");
        return vTextField;
    }
}

因此，这样您就不需要任何其他扩展 TextField（或 PasswordField）的类。

2b) 如果您想允许某些字段记住密码而其他不记住密码，您可以扩展组件并相应地使用您喜欢的组件。您可以保留您的连接器类，如 2a)，但请记住将其命名为 CustomPasswordFieldConnector，并且还应使用该 CustomPasswordField.class 将其命名为 @Connect，将该类放在适合您项目的任何位置，并记住添加正确的 @ 987654329@ 在连接器中以备不时之需。这个类只是一个虚拟类——你可以将它的内容留空，以防你不需要任何额外的功能（但请记住，它应该扩展正确的(component)Field；在示例中PasswordField）。

【讨论】：