AEM 组件的颜色选择器

Question

我正在尝试向我的 AEM 组件添加颜色选择器，以便用户可以在组件对话框中设置颜色。以前它只是一个带有文本选项的 select 列表...

<selectList  jcr:primaryType="cq:Widget" fieldLabel="Color" name="./color1" type="select" xtype="selection" options="/etc/designs/my-project/colors.json" />

我想使用 ColorMenu or ColorPalette 经过反复试验，我在组件对话框中有以下调色板...

<colorMenu jcr:primaryType="cq:Widget" fieldLabel="Color" xtype="colorpalette" name="./color2" colors="" plugins="customColorPlugin"/>

customColorPlugin函数设置颜色数组。 UI 类作品和调色板有可供选择的颜色。

但我不知道如何处理单击事件以将 selected 颜色放入我的 AEM 组件属性中。

打开对话框时出现以下 JS 控制台错误

Uncaught TypeError: undefined is not a function
CQ.Ext.layout.AnchorLayout.CQ.Ext.extend.onLayout CQ.Ext.layout.ContainerLayout.CQ.Ext.extend.layout CQ.Ext.layout.ContainerLayout.CQ.Ext.extend.runLayout

当我点击一种颜色时我得到了这个

Uncaught TypeError: Cannot read property 'addClass' of null CQ.Ext.ColorPalette.CQ.Ext.extend.select CQ.Ext.ColorPalette.CQ.Ext.extend.handleClick

Answer 1

Cannot read property 'addClass' of null 当您的插件提供的颜色的十六进制代码为小写时，它会显示颜色，但在点击时中断。只需将它们转换为大写即可。您还可以查看 colorfield xtype.

AEM 组件的颜色选择器

Color Picker for AEM Component

extjs

aem