この記事では、vue-router ルーティングでパラメータを渡す方法を主に紹介しますので、参考にしてください。
パラメータを渡すルート。ニュース リスト ページなど、ルート上でパラメーターを渡す必要がある場合は、ニュース ID をニュース詳細ページに渡す必要があることがよくあります。
1.ニュース一覧ページテンプレート
<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>
/news/001にアクセスし、ニュース詳細ページにジャンプし、001のニュースを表示します。
2. ニュース詳細ページコンポーネントの準備
<template id="NewsDetail"> <p> 新闻详细页面 <span>{{$route.params.id}}</span> </p> </template>
$route.params.id はルートのパラメータを取得します
3. ルートを定義し、ルートを追加します
{ path: '/news/:id', component: NewsDetail },
4. コード全体は次のとおりです。以下:
home news
首页
登录 注册
新闻列表
新闻001 新闻002 登录界面
注册界面
新闻详细页面 {{$route.params.id}}
以上は皆さんのためにまとめたもので、今後皆さんのお役に立てれば幸いです。
関連記事:
以上がvue-router で渡すルートパラメータを実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。