What is the correct "architecture" in Vue?

Question

JavaScript

I'm learning Vue and I've come across a few different opinions on how to properly build an application.
Let's say I need to get data from the server, process it in a loop and display it in a component. There are options:
1) Vuex actions should not be superfluous, only receive data, then process in the component (for example, in the created hook) with a chain of promises or async / await, then commit:
1.1) directly from the component
1.2) through an action that just commits changes
2) receive data in actions, process them there (or in another action), call commit there. in this case, the code in the component hook will consist of a couple of lines where the desired action is called
An additional question - is it possible to process data in a commit, or should it deal exclusively with the mutation of the store?
I heard these options from two Senior Vue Developers, so I think one of them is still correct. So what's right?

Answer 1

I believe that the business logic should be in Vuex, the component should be clean, all that remains is to get ready-made data from the store and draw, with some kind of dynamics you commit to the store, and it does something again, and the component is redrawn.