zoukankan      html  css  js  c++  java
  • vue2 router-link to

    <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
        }
    ]
  • 相关阅读:
    hdu 3746 Cyclic Nacklace
    hdu 3336 Count the string
    hdu 1358 Period
    hiho一下 第一周 最长回文子串
    KMP算法详解
    Java 之 static的使用方法(6)
    Jave 之方法-函数(5)
    Java 之数组(4)
    大数据-storm学习资料视频
    大数据-spark-hbase-hive等学习视频资料
  • 原文地址:https://www.cnblogs.com/guazi/p/6774026.html
Copyright © 2011-2022 走看看