Hi i'm making a custom plugin that needs to send two of it's attributes to a zustand context whenmy data-table-id
trait(model attribute) changes. So far I've tried this approach:
const objectArrayEditor = (editor, options) => {
editor.BlockManager.add("object-array-editor", {
label: `<div class="gjs-block-label">Object Array Editor</div>`,
attributes: { class: "fas fa-bars" },
category: "Dynamic Form",
content: `<div data-gjs-type="object-array-editor" data-custom-component="object-array-editor"></div>`,
});
const comps = editor.DomComponents;
comps.addType("object-array-editor", {
model: {
defaults: {
traits: [
{ name: "data-table-id", label: t`Table`, type: "table-chooser" },
],
},
init() {
this.on("change:attributes:data-table-id", this.handleKeyChange);
},
handleKeyChange() {
const view = this.getView();
view && view.render();
},
},
view: {component view}
editor.on("component:update", model => {
console.log('TABLE CHANGE:', 'options', options, 'model.getAttributes()', model.getAttributes() );
});
};
export default objectArrayEditor;
As you can see at the final lines I'm listening to the editors component:update
event in order to see if there's any update on the component but I would like to be more specific and listens if my data-table-id
attribute has changed.
Is there any approach to do this ? I've tried with the component:update:{propertyName} event but it's not working.