vue2 router-link to

• Z时代
• 2024-01-10
• 分类：综合

<template>
    <div>
        <nv-header></nv-header>
        <div class="artlist">
            <!-- 栏目 -->
            <ul class="artlistTab clearfix">
                <li v-for="(item, index) in itemTab" :class="{'on':initIndex === index}" v-on:click="changeTab(index)">{{item.title}}</li>
            </ul>
            <!-- 文章列表 -->
            <div class="artlistCon">
                <router-link v-for="art in artlist" class="artitem clearfix" :to="{name:'article',params:{id:art.id}}">
                    <router-link class="avatar" href="javascript:void(0);" :to="{name:'userhome',params:{username:art.author.loginname}}">
                        <img :src="art.author.avatar_url" :alt="art.author.loginname">
                    </router-link>
                    <div class="art-inf">
                        <em :title="art.tab | getArticleTab(art.good, art.top)"
                            :class="art.good | getArticleClass(art.top)">
                            {{art.tab | getArticleTab(art.good, art.top)}}
                        </em>
                        <a class="title">{{art.title}}</a>
                        <span class="rp-count">{{art.reply_count}}/{{art.visit_count}}</span>
                        <span class="last-time">{{art.last_reply_at | getLastTime }}</span>
                    </div>
                </router-link>
            </div>
            <div class="loadingbox" v-show="showLoading">
                <div class="loading"></div>
            </div>
        </div>
        <nv-top></nv-top>
    </div>
</template>

<router-link v-for="art in artlist" class="artitem clearfix" :to="{name:'article',params:{id:art.id}}">

跳转到name为'article'的路有上，并且有参数id＝art.id。
我们再来看看路有怎么写：

const routes = [
{
        path: '/article/:id',
        name: 'article',
        component: article
    }
］

以上是 vue2 router-link to 的全部内容， 来源链接： utcz.com/z/377173.html