java - 如何创建提供自己的标记的链接？

Question

我正在尝试创建一个链接来隐藏或显示我的页面的一部分。该链接应该是可重复使用的，并根据状态显示两个图像之一。

在使用链接的每个页面上添加两个子组件有点笨拙，因此我想创建一个行为类似于链接的组件，同时自动添加其内容。

这是链接组件:

public class ToggleVisibilityLink extends AjaxFallbackLink<Boolean>
{
  public ToggleVisibilityLink(final String id, final IModel<Boolean> model)
  {
    super(id, model);

    setOutputMarkupId(true);

    add(new Image("collapseImage")
    {
      @Override
      public boolean isVisible()
      {
        return !getModelObject();
      }
    });
    add(new Image("expandImage")
    {
      @Override
      public boolean isVisible()
      {
        return getModelObject();
      }
    });
  }

  @Override
  public void onClick(final AjaxRequestTarget target)
  {
    setModelObject(!getModelObject());
    if (target != null)
    {
      target.add(this);
      send(this.getParent(), Broadcast.EXACT, target);
    }
  }
}

这就是我目前在 HTML 中使用它的方式(这被添加到我使用链接的页面或面板中):

<a href="#" wicket:id="collapseExpandLink" class="collapseExpandLink">
  <wicket:link>
    <img src="collapse.png" wicket:id="collapseImage" class="collapseExpandImage collapse">
  </wicket:link>
  <wicket:link>
    <img src="expand.png" wicket:id="expandImage" class="collapseExpandImage expand">
  </wicket:link>
</a>

以及相应的Java调用:

add(new ToggleVisibilityLink("collapseExpandLink", new PropertyModel(this, "hidden")));

但我希望能够跳过链接内的正文，因为人们必须了解 ToggleVisibilityLink 的内部结构。我使用 Dynamic markup in Wicket 尝试了 IMarkupResourceStreamProvider作为起点。通过谷歌搜索，我发现了另一个例子，其中海报只能在 using a Panel 时才能使其工作。 ，我也能做到这一点。但我真的很想保留该链接，而不是将其打包在面板中，因为我无法在标记中设置链接的样式。

我也愿意接受封装链接及其正文的替代方案。

Answer 1

我能够使用 setBody() 让它工作，尽管我试图严重破坏自己(我有重复的库，我自己的不兼容的 jQuery 库导入和自定义资源版本控制策略)。

这是当前的 ToggleVisibilityLink:

public class ToggleVisibilityLink extends AjaxFallbackLink<Boolean>
{
  static {
    Application.get().getSharedResources().add("ToggleVisibilityLinkCollapse",
                                               new MyPackageResource(ToggleVisibilityLink.class, "collapse.png"));
    Application.get().getSharedResources().add("ToggleVisibilityLinkExpand",
                                               new MyPackageResource(ToggleVisibilityLink.class, "expand.png"));
  }

  public ToggleVisibilityLink(final String id, final IModel<Boolean> model)
  {
    super(id, model);

    setOutputMarkupId(true);
    setEscapeModelStrings(false);

    setBody(new BodyModel(model));
  }

  @Override
  public void onClick(final AjaxRequestTarget target)
  {
    setModelObject(!getModelObject());
    if (target != null)
    {
      target.add(this);
      send(this.getParent(), Broadcast.EXACT, target);
    }
  }

  private static final class BodyModel extends AbstractReadOnlyModel<String>
  {
    private final IModel<Boolean> model;

    private BodyModel(final IModel<Boolean> model)
    {
      this.model = model;
    }

    @Override
    public String getObject()
    {
      return this.model.getObject() ?
              "<img src=\""
            + RequestCycle.get().urlFor(new SharedResourceReference("ToggleVisibilityLinkExpand"), null)
            + "\" class=\"collapseExpandImage expand\">"
              :
              "<img src=\""
            + RequestCycle.get().urlFor(new SharedResourceReference("ToggleVisibilityLinkCollapse"), null)
            + "\" class=\"collapseExpandImage collapse\">";
    }
  }
}

其中 MyPackageResource 是 PackageResource 的简单实现(为什么该构造函数受到保护？)。

然后可以简单地将 ToggleVisibilityLink 添加到容器中:

super.add(new ToggleVisibilityLink("collapseExpandLink", new PropertyModel(this, "hidden")));

和

<a wicket:id="collapseExpandLink" class="collapseExpandLink"></a>

并在单击链接时通过事件收到通知。