根据对应的id进行路由跳转

最新推荐文章于 2023-01-06 10:28:36 发布
最新推荐文章于 2023-01-06 10:28:36 发布
阅读量450 收藏
点赞数
文章标签： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_47733490/article/details/121122002
版权

 

 依旧是v-for循环渲染，需求是要id为8的模板才有点击跳转的路由，其他均没有，本应是根据id来进行相应的路由跳转，但当前只写了id为8的部分，其他均没有，所以先写一个

 本来是循环遍历数组，拿到下标，然后判断data[i].id=8的时候才可以跳转，但是for循环遍历拿到下标以后，点击每一个都可以跳转，否则就是点击每一个都不能跳转，后来发现问题想复杂了，直接在点击事件里面用形参就可以了，传入一个row，等于8的时候跳转就可以了

刘大气
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
html页面通过id在页面内跳转,HTML跳转到页面指定位置的几种方法
weixin_32721919的博客
06-03 4336
前言有时候，我们想阅读页面中某段精彩的内容，但由于页面太长，用户需要自己滚动页面，查找起来非常麻烦 ????，很容易让人失去继续往下阅读的兴趣。这样体验非常不好，所以我们可以想办法 ???? 实现点击某段文字或者图片跳转到页面指定位置，方便用户的阅读。一、 纯 html 实现1. 利用 id 为标记的锚点这里作为锚点的标签可以是任意元素。跳转到 id 为 aa 标记的锚点-------------分隔线---...
vue-router 路由跳转传值和获取显示 （解密展示）
weixin_47686269的博客
10-14 1036
vue-router 路由跳转传值和获取 跳转传值的两种方式 通过 path (路径) 进行跳转 如果传入对象, 可以在跳转的同时传参, 但是传递的query参数, 会被暴露在地址栏的查询参数中 this.$router.push('/login') 跳转到登录页 this.$router.push({ path: '/login', query: { aa: 11, bb: 22 } }) 通过 name (
vue 路由id_vue 列表页跳转详情页获取id以及详情页通过id获取数据
weixin_39550258的博客
01-30 3924
1.先在router.js中配置路由{path: '/moviedetail/:movieid',name: 'moviedetail',component:moviedetail}2.获取详情页的id,并派发父组件事件(movielist.vue)页面。。。。。。。methods:{selectitem(item){//console.log(item.moveid);//var item = ...
elementUi表格获取当前行的id,表格路由跳转传id值，进行删除，编辑
CongJiYong的博客
04-19 5657
表格绑定数据 <el-table :data="tableData"> <el-table-column label="通道" prop="id" sortable width="75"> </el-table-column> </el-table> 定义的数据 tableData: [ { id: 1, flag: true, date: '2016
vue点击按钮跳转页面并且获取到当前这条数据的id 在跳转到的页面接收这个id...
weixin_42575505的博客
01-06 1610
可以在按钮的点击事件处理函数中使用 router.push 方法来跳转页面，在跳转时将数据的 id 作为参数传递。然后在跳转到的页面中，可以使用路由对象的 $route.params 属性来获取这个 id。 示例代码如下： <template> <div> <button @click="goToPage(item.id)">跳转</butto...
Nuxt框架的路由跳转及传参
01-20
在 Nuxt 框架中，路由管理是自动化的，但理解如何进行路由跳转和传递参数是至关重要的。下面我们将详细探讨三种主要的路由操作方式。 1. **URL 地址直接跳转** 在 Nuxt 框架中，路由的定义是基于文件结构的。如果...
AngularJS实现单一页面内设置跳转路由的方法
10-19
当`$location.path`被调用时，AngularJS会检测新的路径并根据配置加载对应的视图和控制器。这样，用户就可以在同一个页面中平滑地从一个视图切换到另一个视图，而无需等待整个页面的重新加载。 总结一下，AngularJS...
vue如何通过id从列表页跳转到对应的详情页
08-27
在Vue.js应用中，从列表页跳转到对应的详情页是一项常见的操作，通常涉及到路由、参数传递和组件间通信。以下将详细介绍如何实现这一功能。 1. **使用Vue Router进行路由配置** Vue Router是Vue.js官方推荐的路由...
VueJs路由跳转——vue-router的使用详解
11-26
Vue.js的路由管理工具vue-router是构建单页应用的关键组件，它允许你在不同的视图之间进行导航，并且管理页面状态。以下是对vue-router使用的一些详细解释： **安装** vue-router可以通过npm、bower或直接引入CDN...
vue-router跳转路由的几种方式
dengzy
01-14 1万+
// vue-router学习笔记 记录开发中的点点滴滴 跳转路由的几种方式： 1、声明式： 1) 根据路由路径（/home/sort/detail）跳转 &lt;router-link :to="{path: '/home/sort/detail', query:{id: 'abc'}}"&gt;点击查看子页面&lt;/router-link&gt; 2...
根据数据库ID实现网页跳转
Orange_soda的博客
11-17 3240
本节主要实现的是根据数据库ID实现网页跳转 一：将视图函数数据上传至网页。 1.通过函数 render_to_response("index.html",{"lfi_list":lfi_list})上传到网页 2.通过{{tag}}和{%for if %}等标签动态引用 二：通过ID实现网页跳转 网页上传数据库表ID唯一性实现取数据库内容并上传到网页 1.基网页设置
【vue】页面跳转 路由携带ID
weixin_45650440的博客
04-02 1505
项目场景： 跳转到详情页 问题描述 路由跳不过去 //home.vue <template> <goods-list :goods="showGoods"></goods-list> </template> export default(){ data(){ return{ goods:{ 'pop':'{page:0, list:[]}' , 'new':'{page:0, list:[]}',
jQuery锚点跳转及相关操作（转）
yg_201314的专栏
10-17 1148
1.锚点跳转简介 Edit 锚点其实就是可以让页面定位到某个位置上的点。在高度较高的页面中经常见到。比如百度的百科页面，wiki中的page内容。 我知道实现锚点的跳转有两种形式，一种是a标签+name属性；还有一种就是使用标签的id属性。百度百科就是使用a标签的name属性来实现锚点跳转的。 比如： &lt;a href=”#2”&gt;波轮洗衣机介绍...
学习四：laravel之根据id跳转详情页面（路由绑定模型）
php阿宝的博客
06-12 1178
路由绑定模型： //文章详情页 Route::get('/posts/{post}','\App\Http\Controllers\PostController@show'); 控制器：（传递Post模型对象$post） //详情页面 //方法一 public function show(Post $post) { return view('post/sh...
路由跳转四种方法（带参）
weixin_46453039的博客
07-13 1万+
vue中的四种路由跳转页面方法
路由跳转的3种方式
热门推荐
weixin_45630345的博客
08-15 3万+
路由跳转 方式一：path路径跳转，传值可以使用params 传值和query传值 (缺点:不能传引用数据类型-数组，对象等) <router-link to="/artlist">小说列表</router-link> --> 方式二：命名式路由跳转，name，传值可以使用params和query传值 （优点:可以传基本数据类型和数组，对象） <!-- <router-link :to="{name:'shop',query:{city:cityObj}}"&gt
Vue声明式路由导航和编程式路由导航的优缺点及实现方法
什么都干的派森
05-28 6041
文章目录前言路由实现1.目标2.前置条件3.声明式路由导航实现<1>写路由组件<2>写路由文件<3>实现路由<4>测试4.编程式路由导航实现 前言 声明式路由导航 直接写在html中，结构简单使用方便，但是只能放在<router-link>标签中使用，<router-link>标签会将路由转成<a>标签，通过点击跳转路由，因此局限性也非常大 编程式路由导航 需要写在js中，结构也不算复杂，优势在于非常灵活，不受固定
跳转带id
Reborn_s的博客
12-28 900
1、
通过路由跳转到一个全新的页面
生如夏花S的博客
01-17 2999
1.  在app.vue输入  &lt;router-view&gt;&lt;/router-view&gt; &lt;template&gt; &lt;div id="app"&gt; &lt;router-view&gt;&lt;/router-view&gt; &lt;/div&gt; &lt;/template&gt; &l
vue 如何根据电脑不同分辨率 路由跳转到不同页面
最新发布
05-31
1. 在 `router/index.js` 中定义路由规则和对应的组件。 ```javascript import Vue from 'vue' import Router from 'vue-router' import Desktop from '@/views/Desktop.vue' import Mobile from '@/views/Mobile....
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值