java - 如何在不向 DOM 添加 DIV 的情况下创建 GWT Composite 小部件？

Question

如果我使用 UIBinder 创建一个 Composite Widget，然后在代码中使用我创建的 widget，它会插入额外的 <div>我的小部件周围的元素。有没有办法去掉div或者控制它是什么类型的元素？

public class ExamplePanel<T> extends Composite {
    @UiField LabelElement inputLabel;
    private static ExamplePanelUiBinder uiBinder = GWT.create(ExamplePanelUiBinder.class);
    interface ExamplePanelUiBinder extends UiBinder<Widget, ExamplePanel> { }

    public ExamplePanel() {
        initWidget(uiBinder.createAndBindUi(this));
    }
}

<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder" xmlns:g="urn:import:com.google.gwt.user.client.ui">
    <g:HTMLPanel>
            <label ui:field="inputLabel">Label text</label>
    </g:HTMLPanel>
</ui:UiBinder>

编辑看起来 DIV 是由 <g:HTMLPanel> 创建的

Answer 1

是的，div 是由 HTML 面板创建的。您可以删除 HTMLPanel，但必须将绑定(bind)类型更改为 Element，并且您将无法再将其用作组合。在这种情况下，我会执行以下操作:

public class ExamplePanel extends Widget
{
    private static ExamplePanelUiBinder uiBinder = GWT.create(ExamplePanelUiBinder.class);

    interface ExamplePanelUiBinder extends UiBinder<Element, ExamplePanel>
    {
    }

    @UiField LabelElement inputLabel;

    public ExamplePanel()
    {
        setElement(uiBinder.createAndBindUi(this));
    }
}

<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder">
    <label ui:field="inputLabel">Label text</label>
</ui:UiBinder>