[Vuejs]-Vue Reactivity issue, setting array element property

Here’s the article describing how exactly reactivity works in Vue 2.x. And yes, (in that version) you should never update a property of tracked object directly (unless you actually want the changes not to be tracked immediately).

One way (mentioned in that article) is using Vue.set() helper function. For example:

Vue.set(this.filteredSkillTiers[skilltierIndex]
  .categories[categoryIndex].recipes[recipeIndex], 'profit', 'new Profit');

You might consider making this code far less verbose by passing recipe object inside CalculateRecipe function as a parameter (instead of those indexes), then just using this line:

Vue.set(recipe, 'profit', promiseResolutionValue);