Any way to prevent "getter" function on initial load?

[yabdab]

I have a getter function, get isValid() { ... } that I only want executed when specifically called.

Right now it is getting triggered when the component is loaded.

How can I prevent this?

[SimoTod]

The getter shouldn't already be executed until you try to access the property. Do you have an example to demostrate that this is not the case?

[ekwoka]

getters will not be run until accessed. (Or at least should not).

[yabdab]

Yep, yer both right. I found the problem and it was me 😖😝

Thanks guys.

[yabdab]

Update, I found the issue and it is $watch. If I "watch" the component, then it triggers all the properties in the component.

I am using this in the init() ...
this.$watch("appItems", () => (value = this.process()));

appItems is an array of objects.

I guess there is no way to make certain properties un-watchable?

[SimoTod]

yes, watch will walk your array and access each property of the objects so it can watch for any internal changes at any level.
There's no way to make an inner property un-watchable but if it's a readonly property, you can just use a normal function (note, because alpine out evaluate functions in it's directive and it doesn't need arguments,. you can still omit the parentheses when you use the function in something like x-text)

[ekwoka]

@yabdab you can use Alpine.effect instead (be sure to release it) and then you can just access the appItems length.

$watch has to stringify the object, which means accessing all getters, unless you define them as not enumerable.