Cet article présente principalement la méthode de transmission des paramètres dans le routage vue-router. Maintenant, je le partage avec vous et le donne comme référence.
Paramètres de transmission de l'itinéraire. Plusieurs fois, nous devons transmettre des paramètres sur l'itinéraire, tels que la page de liste d'actualités, nous devons transmettre l'ID d'actualité à la page de détails de l'actualité.
1. Modèle de page de liste d'actualités
<template id="news"> <p> <h2>新闻列表</h2> <ul> <li> <router-link to="/news/001">新闻001</router-link> </li> <li> <router-link to="/news/002">新闻002</router-link> </li> </ul> </p> </template>
Nous visitons /news/001, passons à la page de détails de l'actualité et affichons les actualités de 001.
2. Préparation des composants de la page de détail des actualités
<template id="NewsDetail"> <p> 新闻详细页面 <span>{{$route.params.id}}</span> </p> </template>
$route.params.id récupère les paramètres de l'itinéraire
3 . Définissez l'itinéraire et ajoutez un itinéraire
{ path: '/news/:id', component: NewsDetail },
4. L'ensemble du code est le suivant :
home news
首页
登录 注册
新闻列表
新闻001 新闻002 登录界面
注册界面
新闻详细页面 {{$route.params.id}}
Ce qui précède est ce que j'ai compilé. pour tout le monde. J’espère que cela sera utile à l’avenir.
Articles associés :
Comment connecter l'imprimante en javaScript
Comment passer des événements dans le composant vue
Introduction détaillée à l'utilisation de la capture du modificateur d'événement Vue
Un problème 404 se produit lors de l'actualisation de la page dans React-Router
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!