【发布时间】：2018-07-01 08:50:12
【问题描述】：
我对 AEM 非常陌生，而且我正在努力使用按钮组件。它有一个下拉菜单，要求打开类型，所以要么是新窗口，要么是模式。理想情况下，将 target="_blank" 或 data-modal 作为渲染的一部分。
这是我的对话：
<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
jcr:primaryType="nt:unstructured"
jcr:title="Button"
sling:resourceType="cq/gui/components/authoring/dialog">
<content
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns"
margin="{Boolean}false">
<items jcr:primaryType="nt:unstructured">
<column
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/container">
<items jcr:primaryType="nt:unstructured">
<label
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
fieldLabel="Button label"
name="./label"/>
<linkTo
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/pathfield"
fieldLabel="Link to"
name="./linkTo"
rootPath="/content"
suffix=".html"/>
<cssClass
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
fieldLabel="Css class(es)"
name="./cssClass"/>
<open
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/select"
fieldLabel="Open options"
fieldDescription="A new tab/window, or a modal"
name="./open">
<items jcr:primaryType="nt:unstructured">
<def
jcr:primaryType="nt:unstructured"
text="(default)"
value=""/>
<tab
jcr:primaryType="nt:unstructured"
text="New Tab/Window"
value="target='_blank'"/>
<modal
jcr:primaryType="nt:unstructured"
text="Modal Window"
value="data-xxx"/>
</items>
</open>
<secondary
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/checkbox"
checked="${not empty cqDesign.useSecondary ? cqDesign.useSecondary : false}"
fieldDescription="Use the secondary style for the button."
name="./useSecondary"
text="Use secondary style"
uncheckedValue="false"
value="{Boolean}true"/>
</items>
</column>
</items>
</content>
</jcr:root>这是我的 button.java
package apps.bbcom_aem_project.components.content.button;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.apache.commons.lang3.StringUtils;
import org.apache.sling.api.resource.Resource;
import org.apache.sling.api.resource.ValueMap;
import com.adobe.cq.sightly.WCMUsePojo;
public class Button extends WCMUsePojo {
public static final Logger log = LoggerFactory.getLogger(Button.class);
public static final String PROP_LINK_TO = "linkTo";
public static final String PROP_LABEL = "label";
public static final String CSS_CLASS = "cssClass";
public static final String OPEN = "open";
private String linkTo;
private String label;
private String cssClass;
private String open;
@Override
public void activate() throws Exception {
Resource resource = getResource();
ValueMap properties = getProperties();
linkTo = properties.get(PROP_LINK_TO, "#");
label = properties.get(PROP_LABEL, "");
cssClass = properties.get(CSS_CLASS, "");
open = properties.get(OPEN, "");
if (StringUtils.isNotEmpty(linkTo) && !"#".equals(linkTo)) {
// is linkTO does not starts with http
if( !linkTo.startsWith("http") ) {
linkTo = linkTo + ".html";
}
}
log.debug("resource: {}", resource.getPath());
log.debug("linkTo: {}", linkTo);
log.debug("label: {}", label);
}
public String getLinkTo() {
return linkTo;
}
public String getLabel() {
return label;
}
public String getCssClass() {
return cssClass;
}
public String getOpen() {
return open;
}
}此时我没有错误，并且 Maven 全新安装没有错误。
这是我当前的 button.html
<div data-sly-test="${wcmmode.edit || wcmmode.design}"><small class="text-muted"><em>Button Component - Configure</em></small></div>
<a data-sly-use.button="Button" data-sly-test="${button.label != ''}" class="btn ${properties.useSecondary ? 'btn-secondary' : 'btn-primary'} ${button.cssClass}" href="${button.linkTo}" role="button" data-opentype="${button.open}" ${button.open} >${button.label} ${button.open}</a>当我检查元素时，我看到了：
<a class="btn btn-secondary " href="#" role="button" data-opentype="data-xxx" ${button.open}="">Workspaces data-xxx</a>data-xxx 匹配我在组件选项中选择的内容，但我无法在开始标记中呈现它。
【问题讨论】：
-
使用完整的类名：
data-sly-use.button="apps.bbcom_aem_project.components.content.button.Button"
标签： aem