Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

Diferenças para acessar informações do provedor Vuex

No componente da barra de navegação temos uma computed para verificar se o usuário esta logado.

computed: {
    isLogged () {
      return Boolean(this.$store.state.token)
    }
  }

na pasta http temos um interceptador que pega o valor do token no estado a atribui a uma variável.

import provider from "../provider";

http.interceptors.request.use(function(config) {
    const token = provider.state.token
    if ...

Os dois casos estão fazendo a mesma coisa? Acessando o valor de state.token? No segundo caso o acesso é feito de forma diferente, eles precisam ser dessa forma nesses casos? Ou podemos escolher qualquer uma das formas para acessar o estado da aplicação? Ou eu entendi tudo errado e oq estou falando não faz o menor sentido? rs.

3 respostas
solução!

Olá, Luciana!

A diferença é que o Vue injeta, diretamente no componente, a store. Com isso, podemos acessar assim:

this.$store.state.token

No caso do interceptor, nós precisamos realizar o import manualmente, para só então podermos acessar a store:

import provider from "../provider";

http.interceptors.request.use(function(config) {
    const token = provider.state.token

Sempre que precisamos da store fora dos componentes Vue, precisamos importá-lo antes.

Entendi! No caso os dois fazem a mesma coisa, acessar a store.

Porém uma das formas podemos usar quando estamos codando em um component vue, fora desse contexto utilizamos o import.

Pelo o que entendi poderíamos utilizar o import no componente vue também, correto?

Sim, poderíamos!

Só não é necessário pois o Vue disponibiliza a store para todos os componentes.