https://juejin.im/post/5e8f5c3c6fb9a03c6f66fb28
# O que é o VueX?
** Modo de gerenciamento de estado ** desenvolvido para aplicativos vue.js. vuex é um modelo de gerenciamento de estado
* state, a fonte de dados que aciona o aplicativo;
* view, que mapeia o estado para a view de maneira declarativa;
* ações, que respondem às alterações de estado causadas pela entrada do usuário na view.
! [] (https://user-gold-cdn.xitu.io/2020/4/10/1716010dca30e154?w=1280&h=866&f=png&s=25103);
### Por que usar o vuex?
> Para a pergunta um, o método de passar parâmetros será muito complicado para componentes aninhados em várias camadas e é impotente para a transferência de estado entre os componentes irmãos.
Para o problema dois, geralmente usamos várias cópias do componente pai-filho para referenciar diretamente ou alterar e sincronizar o estado por meio de eventos. Esses padrões acima são muito frágeis e geralmente levam a um código não sustentável.
>
! [] (https://user-gold-cdn.xitu.io/2020/4/7/17153cee622785f3?w=701&h=551&f=png&s=8112);
Ciclo de vida
beforeCreate, created, beformMount, montado, beforeUpdaete, atualizado, beforeDestroy, destruído. Mantenha a
função de gancho de ciclo de vida ativo: ativado, desativado. O
uso de `<keep-alive>` manterá os dados na memória, se você desejar Para obter os dados mais recentes ao entrar na página desta vez, ele precisa ser ativado em `ativado`
# Visualização do roteador
### [A diferença entre \ $ router e $ route? ] (https://www.cnblogs.com/czy960731/p/9288830.html)
> router é um objeto do VueRouter, por meio do construtor Vue.use (VueRouter) e VueRouter para obter um objeto de instância do roteador Um objeto global, que contém todas as rotas, contém muitos objetos e atributos principais.
### [A diferença entre este. \ $ Route.params e este. \ $ Route.query do vue? ] (https://www.cnblogs.com/happybread/p/10156869.html)
** 1.este. uso de $ route.query **
A, parâmetros de transmissão:
`` `
Router.push os este $. ({
Caminho: '/ Monitor',
{: Inquérito
ID: ID,
}
})`
``
B, parâmetros de aquisição:
. $ Route.query.id a esta
C 、 Na forma de url (com parâmetros em url)
http://172.19.186.224:8080/#/monitor?id=1
D. Ao transferir parâmetros entre páginas por roteamento, atualize a página que transfere parâmetros após o salto, Os dados também mostrarão a existência (encontrou este problema no projeto)
** 2. Use this. $ Route.params **
A. Passando os parâmetros:
``
this. $ Router.push ({
name: 'monitor',
params: {
id: id,
}
})
``
B Parameters Obtenha parâmetros:
this. $ Route.params.id
C, na forma de url (sem parâmetros na url)
http://172.19.186.224:8080/#/monitor
D, ao passar parâmetros entre páginas por salto de rota , Atualize a página do parâmetro passado após o salto, os dados não existem (esse problema é encontrado no projeto)