Linting error wrongly shown?

When I start my mobile app, it's showing soe errors in the console, but in my opinion they're wrong.
The debug tool is showing the same error in linting:
image

The top one is related to a button that is hidden if a condition is (not) met.
image
packsArray.value equals null on app start, until the first code is scanned.
image

So I'm wondering why the error is being shown. When I select the button it goes away.

The second one is related to a API call that is being made after being manually triggered.
Again the same state is involved
image

Same applies for the third one, which is being triggered manually at last, after the GetDeliveryDetails.
image
Same state is involved here, which is null on start.

The app runs fine, but I don't understand why it's throwing those errors.
Any idea?

I'll try to provide an example that hopefully helps you avoid linting errors with my limited knowledge :smiley:

Linting is the process of performing static analysis on source code to flag patterns that might cause errors or other problems . As an application progresses through the various stages of development, code quality becomes critical.

In some cases you'll build component with a value or update query with selected item. However if the data isn't loaded {{}} is still being evaluated and in your case .packlist doesn't exist in the value.

The app should work fine but always important to remember that if the item is required within the query it should be there or you have safe guards for those cases (i.e. you don't want query to update if the data is null).



Hope this helps!

This is my safeguard for the Get call:
image

Same for the Reg call:

Should be ok isn't it?

I'm guessing you don't want to run these if your results array is empty (or has a "falsly" value)?

Try using {{!GetShippingDetails.data}} instead of {{GetShippingDetails.data != null}} (same concept applies elsewhere)



Yes, this should be okay. That red outline is telling you the template fails given the CURRENT state of the app, ignoring the "Only run when" setting. (I assume that this screenshot was taken when GetShippingDetails.data is nullish.)

1 Like

@bca yes, that value was null at that time. Just opened the app and that query is being triggered from a button.
So this is expected/correct behaviour? Just ignore it or is there a anything I can do to get rid of it?

Yeah, it's expected/correct. To silence it you can use optional chain syntax: GetShippingDetails.data?.details?.CARRIER.

Thanks, got me a bit further, but still I'm getting this:

Although they might not do harm, I don't like it that there are (potential) errors. I think I'll have to put that value in a separate state that can an empty string or null value.

You can use optional chaining ("?.") to escape errors like these - i.e. packsArray.value?.[0]?.packingList.

The optional chaining (?.) operator accesses an object's property or calls a function. If the object accessed or function called using this operator is undefined or null, the expression short circuits and evaluates to undefined instead of throwing an error.