• 每天一点点之vue框架开发


    场景:要实现一个标签云,通过循环把标签渲染,然后单击标签的时候实现跳转,跳转路由一样,通过唯一参数来实现请求不同的数据

    因此,就需要在for循环中来携带参数,本节所讲的是路由使用对象的形式(别名)来实现的

    <router-link :to="{name:'blogDetailsLink'} ></router-link >

    如果你也是这种情况,那你就可以继续往下看了

    1.在home.vue中代码实现携带参数

    <li v-for="item in laber_cloud" >
           <router-link :to="{name:'blogDetailsLink',params:{id:item.id}}" >{{item.name}}</router-link>
    </li>

    2.路由:

    { path: '/home/blogDetails', name: 'blogDetailsLink', component: BlogDetails }, 


    3.blogDetails.vue中获取参数

    // 在html中获取
    {{$route.params.id}}
    
    // 在js中获取
    this.$route.params.id

    这样就实现在循环中给url携带参数,但是这样有一个问题,就是url相同,参数不同,点击之后没有效果

    如果你出现这种 路由相同参数不同不能跳转的问题,那么你可以点我查看详情

  • 相关阅读:
    天梯赛练习2 补题
    QFNU 天梯赛练习 1 补题
    2019 山东省赛 B 题
    CCPC2020 网络赛 总结
    一个比较好看的 Typora 主题
    〔OS〕磁盘调度算法
    〔OS〕页面置换算法
    〔OS〕多线程模拟实现生产者和消费者
    〔OS〕银行家算法
    LCS and LIS
  • 原文地址:https://www.cnblogs.com/cap-rq/p/10183630.html
Copyright © 2020-2023  润新知