Wicket

Question

我在 Wicket 中有两个面板。

ParentPanel 和 ChildPanel

场景

ChildPanel 是 ParentPanel 的组成部分。每次在父面板中触发某个事件时，我想在 ChildPanel.

中添加某个 javascript

工作解决方案

ParentPanel.java

public class ParentPanel extends Panel
{
    private static final long serialVersionUID = 4306746527837380863L;
    private final ChildPanel childPanel;

    public ParentPanel(String aId, IModel<AnnotatorState> aModel)
    {
        super(aId);
        model = aModel;

        // initially the Child panel is empty. passing empty model
        childPanel = new ChildPanel("child-container", Model.of());
        childPanel.setOutputMarkupId(true);
        add(childPanel);
    }

    @OnEvent
    public void onClickText(RenderEvent aEvent)
    {
        LOG.trace("Event Fired");
        IPartialPageRequestHandler iPartialPageRequestHandler = aEvent.getRequestHandler();

        Integer someData = getSomeData();
        childPanel.setDefaultModel(Model.of(someData));

        //I am trying to add the child panel to the ajax target to ensure rerendering of child panel.
        iPartialPageRequestHandler.add(childPanel);
    }
}

ChildPanel.java

public class ChildPanel extends Panel
{
    private static final long serialVersionUID = -3849226240909011148L;
    private static final Logger LOG = LoggerFactory.getLogger(ChildPanel.class);
    private IModel<Integer> model;

    public ChildPanel(String aId, IModel<Integer> aModel)
    {
        super(aId);
        model = (aModel);
    }

    @Override
    public void renderHead(IHeaderResponse aResponse)
    {
        super.renderHead(aResponse);
        model = (IModel<Integer>) getDefaultModel();

        if (model == null)
            return;
        Integer someData = model.getObject();
        String someJavascript = createSomeJavascript(someData);

        log.debug("Rendering Updated UI with the JS: ", javascript);
        aResponse.render(OnDomReadyHeaderItem.forScript(javascript));
    }
}

显然每次将 childPanel 添加到 iPartialPageRequestHandler 时都会调用 renderHead()，它会完成我的工作，即在 ParentPanel 中触发的每个事件上更新 UI。

问题

但是有人告诉我这不是一个好的做法。由于在这种情况下，JS 被添加到 renderHead()，然后它最终出现在页面源代码中——发送（大）JSON 数据时会变得很麻烦。需要找到将 JS 附加到 AJAX 目标的好地方（可能是 render() 或可能更好的 onRender() 或 onAfterRender()），前提是它在 Wicket 中 possible/doable。由于我的知识有限，我无法猜测我还能如何实现这个场景。任何其他（更好或可能的）解决方案都受到欢迎和赞赏。

谢谢。

Answer 1

我假设问题是 createSomeJavascript 产生了一大堆代码？

然后我会重构它，以便 createSomeJavascript 只调用您使用 JavaScriptResourceReference 添加到组件的函数。这样，只有一小部分 Javascript 最终出现在源代码中。

例如，将您的 javascript 放入这样的外部文件中：

private static final ResourceReference  JS_QM   = new JavaScriptResourceReference( ClientPanel.class, "question.mark.js" );


@Override
public void renderHead( Component component, IHeaderResponse response )
{
    super.renderHead( component, response );
    response.render( JavaScriptReferenceHeaderItem.forReference( JS_QM, "question-mark" ) );
    ...
}

Wicket - 追加 Javascript（什么是更好的做法？）

Wicket - Append Javascript (What is Better Practice?)

javascript

java