Recursive calls crashing application

[Suraj S]

Hi @victorgarciaesgi , I followed a couple of your examples and wanted to do something like this.

https://codesandbox.io/s/intelligent-meninsky-eeqnd?file=/src/components/HelloWorld.vue

It gives me this error

Maximum recursive updates exceeded. This means you have a reactive effect that is mutating its own dependencies and thus recursively triggering itself. Possible sources include component template, render function, updated hook or watcher source function. 

I suspect It has something to do with the options being reactive when passed to the component. If the options are removed, everything works fine

In the codesandbox link, even though the console logs a warning and it works fine. I get an error of the same type and it breaks

[Victor Garcia]

Hi again @TheCelebrimbor, I'm not having the problem with Vue 2 so it seems again to be a Vue 3 problem :(, I will look at it. I can disable reactive options in the meantime

[Suraj S]

I updated to vue 3.1.2. Now it does not throw error but warns about it in the console as in the sandbox.

[Victor Garcia]

If think it's because in your code you have a circular dependency here

let options: any = ref(barOpt);

 let selectedValue = ref("bar");
    
    const component = computed(() => {
      if (selectedValue.value === "bar") {
        options.value = barOpt;
        return Bar;
      } else {
        options.value = donutOpt;
        return Doughnut;
      }
    });

component is depending on options, and component is changing options back. So it's what makes the call stack.
Also it is not advised to modify refs inside computed, use watch instead!

[Suraj S]

@victorgarciaesgi Never mind! :) :). Seems to be a ref issue.

I asked about this on discord.
It seems we need to us computed if we want to mutate any refs and not watch

here is a link to the fixed sandbox. Notice how the value of options is not a ref but computed
https://codesandbox.io/s/keen-rhodes-mi84j?file=/src/components/HelloWorld.vue

[Suraj S]

@victorgarciaesgi Exact words

"There are times where mutating reactive state in watchers is appropriate, like here.
Rule of thumb is that it shouldn't be used to derive state from other state, that's what we've got computeds for."

Thanks for the assist though!