Explique o \ roteador e \ rota em vue
this. $ router.push ('/ path /') é
apenas um dos atributos para jump routing push, então não vou apresentá-los um por um aqui.
este. $ route pode obter os parâmetros que passamos e a consulta de
parâmetros de id de rota dinâmica
Podemos primeiro entender a relação entre os dois como:
O roteador é todas as rotas que configuramos atualmente, e a rota é uma das rotas que está ativa
este. $ router
- Durante o processo de configuração, todas as rotas são armazenadas no objeto roteador
- Ao passar
this.$router.push('/路径/'), podemos fazer um salto de rota e adicionar esta rota à pilha de histórico - O objeto do roteador aqui é essencialmente uma instância VueRouter
esta. $ route
O entendimento popular é qual rota está ativa no momento e qual rota é tomada
Forma de passar parâmetros
Quando estamos fazendo um salto de rota, podemos passar alguns parâmetros. Os funcionários da Vue também fornecem duas maneiras
- params
- inquerir
params
Em primeiro lugar, precisamos ter clareza sobre um conceito, qual é a sua essência, aqui apresentamos um conceito: roteamento dinâmico
Geralmente escrevemos uma rota para um componente, mas quando lidamos com a interface do usuário, a rota é frequentemente incerta, então esperamos que o roteamento da rota possa ser alterado dinamicamente, como o seguinte caminho: um grande número de IDs de usuário estão atrás
/user/mary
/user/kris
Vamos implementá-lo, em vez de <roteador-link </ roteador-link em vue
Estamos no arquivo do roteadorindex.jsConfigure primeiro
Após a configuração, precisamos irAPP.viewEscreva um método para passar parâmetros em
Por meio do método de emenda de strings, clicamos no botão do usuário, executamos o método btnUser e pulamos para a interface do usuário
Mas neste momento não configuramos a interface do usuário, vamos renderizá-la
Ele será usado aqui this.$route, a rota da interface do usuário é atualmente a rota mais ativa (em uso), podemos obter o parâmetro userId
inquerir
Formato de configuração de roteamento: configuração normal
router / index.js
Ver aplicativoEscreva no método js
Profile.vuePegue o objeto passado e renderize
