How can I change a component property inside of a component?

Ask us anything
1

Hi there,

I am currently building a task component. It includes a property called “Done” that allows you to mark a task as complete or incomplete. This property is linked to various style properties within the component. Everything works correctly when I modify the “Done” property externally. However, I am facing an issue when attempting to alter the “Done” property internally within the component. It seems that I do not have access to the property in the workflow builder or I’m just unable to find it. :man_shrugging:

What can I do to modify the component property within the component itself?

Thanks in advance,
Andy

2

The property is managed exclusively by the instances, so you cannot really. What you can do is:

  • Create a variable
  • You can manipulate and bind to this variable
  • Make a workflow ‘On prop change’ and then update the variable when the property changes
3

Hi @luka, thank you so much for your fast response. Maybe I missunderstand something, but I don’t want to wait for the “On prop change” event, I want to trigger that event inside the instance!?!

4

Trigger event = done. Do this inside the component and provide whatever event schema

Then …

Head to the instance and go to workflows then select your “done” trigger and continue your workflow from there.

But if this isn’t it then follow Luka’s advice. I do components all the time.

5

Hm… thank you so much for your help guys… After some try and error I’ve done it this way:

  • I’ve created a boolean component variable for the checked/unchecked state
  • I’ve created a new state with a condition using this variable
  • I’ve created a workflow where I change this variable on click to true or false
  • I’ve created a boolean property and when I set it to true or false this will update the variable with the “On property change” event.

Now I can change the state of the component from outsite (by using the property) and from inside (by clicking on an element). BUUUUUT :crazy_face: How can I also update the property, when I’m clicking on an element and change the variable. In other words: When I change the check status by changing the component variable I want also change the component property automatically so that this keeps consistent.

I’ve searched for Trigger event and event schema, but I couldn’t find anything how to use it :man_shrugging:

Thanks in Advance,
Andy