I was looking at creating a simple generic reusable text-only widget in apostrophe-cms so I made the module text-only-widgets .
with the following code
In lib/modules/text-only-widgets/index.js
module.exports = {
extend: 'apostrophe-widgets',
label: 'Section Heading',
beforeConstruct: function (self, options) {
console.log('options.addFields : ', options.addFields)
options.addFields = [
{
name: 'sectionHeading',
label: 'Section Heading',
type: 'string'
}
].concat(options.addFields || [])
}
};
In lib/modules/text-only-widgets/views/widget.html
{{ data.widget.sectionHeading }}
I now tried using the above widget in one of my pages as below:
<div>
{{
apos.area(data.page, 'aboutUsDescriptionTwo', {
widgets: {
'text-only': {
addFields: [
{
name: 'sectionDescription', // set these fields dynamically
label: 'Section Description', // set these fields dynamically
type: 'string'
}
]
}
}
})
}}
</div>
As shown in the below image, notice even after passing the addFields with label as Section Description to the text-only widget doesn’t override the defaults set in the index.js.
I tried console.log on the options.addFields in index.js but it logs undefined as show below, I also tried few different variations but none works.
I was not sure whether this question is fit for this forum or for stackoverflow so I have also posted it on stackoverflow at the below link: