Layouts y Vuex Modules

10/27

Lectura

Aunque la app se ve mejor sigue estando la falta de estilo, ya que se ve todo alineado a la izquierda.
AlLeft

...

Regístrate o inicia sesión para leer el resto del contenido.

Aportes 10

Preguntas 3

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Aquí les dejo el fix.

En la parte de store/index.js debemos agregar el modulo de Loading por lo que debería quedar así:

import Vue from'vue'
import Vuex from'vuex'

import oauth from'./modules/oauth'
import loading from'./modules/loading'

Vue.use(Vuex)

export default new Vuex.Store({
  modules: {
    loading,
    oauth
  }
})

Y en App.vue debería quedar así en la parte de Script:

import MainLayout from '@/layouts/MainLayout'
import LoadLayout from '@/layouts/LoadLayout'
import BaseLoading from '@/components/BaseLoading'

export default Vue.extend({
  name: 'App',
  components: {
    MainLayout,
    LoadLayout,
    BaseLoading
  },
  computed: {
    isLoading () {
      return this.$store.state.loading.isLoading
    }
  }
})

Hola, hasta ahora todo genial. Solo me preguntaba si hay alguna razon particular por la cual usamos mayusculas para algunos metodos por ejemplo: SET_LOADING, SET_ACCESS_TOKEN, SET_LOADING ?

Son metodos reservados o es solo un estandar o buena practica?

Muchas gracias de antemano.

Perfecto, aunque tengo dos cuantas dudas:

1.- Tengo entendido que por buenas prácticas (Y esto se menciona en los cursos anteriores), el v-if solo se debe usar en componentes que vamos a renderizar una sola ves, en este caso, ocuparemos el loader en diferentes ocasiones, por lo que usar v-if podría consumir más recursos de los esperado, ¿No sería mejor usar v-show? Así solamente mostramos el loading cuando lo necesitemos y cuando no solo se oculta con CSS (v-show), así no estamos rendereando una y otra vez el loader, aunque claro, esto igual puede dar problemas, porque si en el layout principal usamos propiedades que no están disponibles aún, al usar v-show dará un error, pero con v-if no habrá problema

2.- Ya que el loader lo usaremos mucho, ¿No sería más práctico importarlo como un componente global? Algo así como Bootstrap-vue que no necesitamos importarlo en cada componente que usemos?

Muy guay el tema de los namespaces de Vuex!!

¿Que significa el {root:true} dentro de commit(‘loading/SET_LOADING’, true, { root: true })?

Como pequeño aporte me gustaría añadir que a_ mapState_ también es posible enviarle como segundo paramétro un Array de elementos con los estados que queremos traernos, que a mí personalmente, me gusta más como queda:

//...mapState('loading', { isLoading: 'isLoading })
...mapState('loading', ['isLoading'])

Seguimos con el curso !! 👍🏻

Hola, estuve copiando y probando el código, salió todo ok. Pero a veces en la consola me daba error de identacion o falta linea de espacio al final de cada archivo. Hay alguna manera de solucionarlo sin estar yendo linea por linea? Ejemplo de errores:
23:1 error Expected indentation of 6 spaces but found 8 indent
47:2 error Newline required at end of file but not found eol-last

Compañeros, leí la documentacion de Vuex pero la verdad no me queda muy claro como funciona el el spread operator en el mapState(), Gracias!

😛

Hola! en esté y varios documentos más están cortadas algunas etiquetas de cierre de componentes y el contenido está incompleto.

Genial! no tengo todavía muy claro para que sirve namespaced: true alguien me explica por favor?