P
P
profcat2020-02-14 17:37:24
Vue.js
profcat, 2020-02-14 17:37:24

What are the rules for good code for Vue/Vuex?

Hello. The Internet is full of answers to technical questions, and, as always, I have problems with other aspects of programming, namely the style of writing code for Vue / Vuex. At the moment, the following questions came to mind:

1) Is it necessary to return the storage state in a computed property? This is suggested right away in the first sections of the Vuex documentation. Would it be bad practice if I only needed to use constructs like this.$store.state.smth a few times?

2) How much should a mutation be loaded inside the repository?
Let's say there are many different functions, each with a size of 30 lines of code, at least. Would it be nice if I described them in full size right in the repository, even if several of them are used in only one component? Or is it necessary to make the storage size as small as possible, transfer the functions to the component, and from there, when you need to transfer the result to the state, pass it through a mutation, in which there will be only an assignment and nothing more?

3); What is the normal module length for a single file Vue component?

4) Aside from templating, what style of writing html code in Vue modules is the most attractive and understandable, do you have any examples?
In fact, the list of questions does not end there. If you have any links to resources where there are recommendations that are not in the official documentation, please suggest.

I would also be glad to look at the code of your small projects (not that things, something more complicated) =)

Answer the question

In order to leave comments, you need to log in

1 answer(s)
A
Alex, 2020-02-14
@profcat

  1. Yes
  2. Everything is simple here: Is the function or data needed only in one component or in several? In one - everything is in the component. Otherwise in storage. The mutations themselves should be as easy as possible. They block the interface.
  3. Less is better. It is better to take out any unrelated logic in a separate component. This again will affect performance for the better.

Links:
  • https://ru.vuejs.org/v2/style-guide/index.html
  • https://habr.com/en/post/483042/
  • https://arutyunov.me/blog/vue/26-sovetov-dlya-vue-...

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question