Working with multiple inputs on uibuilder node

General
1

Hi, im relatively new to the uibuilder node and VueJS. I have following problem:

For example, if i have multiple inputs to a uibuilder node over msg.payload. I catch them with the uibuilder.onChange() function. So good so far. Now i've got one input from a node, lets say testVal (msg.payload.testVal) and an input from another node - testVal2 (msg.payload.testVal2).

uibuilder.onChange('msg') inside index.js

 vueApp.testVal = msg.payload.testVal;
 vueApp.testVal2 = msg.payload.testVal2;

Now i'll see testVal updating every second due to the back-end but when testVal2 triggers uibuilder.onChange() cause its updated too, testVal will have no value in that moment causing it to display wrong/nothing. Im using the link nodes to connect the dashboard to the individual components on each flow. Is there a way to seperate the values so they don't disturb each other?

2

Hi. I generally make use of msg.topic to help differentiate different incoming data since that is usually easy to set in Node-RED and it doesn't affect the payload.

Either way, what you need in your onChange function is an if or a switch statement to differentiate between the different msg types (which is why it is easier to use msg.topic).

if ( msg.payload.testVal ) {
    // ... do stuff on this msg
} else {
   // ...
}

Or better:

if ( msg.topic === 'type1' ) {
    // ... do stuff on testVal
} else {
   // ... do stuff with testVal2
}

It is tempting to do the logic inside the if/switch. But you will generally thank yourself if you create a separate function to encapsulate the logic. But that is a matter of style.

3

Thank you very much! I think i'll do it in a seperate function :slight_smile: