VUE通过id从列表页跳转到相对的详情页
新闻列表页面:
在这里我用a标签进行跳转,在vue里面可以这样写<router-link></router-link>
|
1
|
<router-link :to="{path:'/news',query:{ id:item.NewsID }}" class="around"></router-link> |
新闻详情页:
1)首先要获取id
|
1
|
var newsID=this.$route.query.id;6 |
2)拼接到url上面
|
1
|
this.$http.get(this.$store.state.index.ip + '/api/News/'+newsID) |
完整写法:
|
1
2
3
4
5
6
7
8
|
created: function() { var newsID=this.$route.query.id; this.$http.get(this.$store.state.index.ip + '/api/News/'+newsID).then((response) => { console.log(response); }).catch(function(error) { console.log(error); });} |
这样就可以把id传过去啦
VUE通过id从列表页跳转到相对的详情页的更多相关文章
- vue通过id从列表页跳转到对应的详情页
1. 列表页:列表页带id跳转到详情页 详情页:把id传回到后台就可以获取到数据了 2.列表页跳转到详情页并更改详情页的标题 列表页:带id和页面标题的typeid跳转到详情页 详情页:在html绑定 ...
- 1、找出url汇总页,过滤出满足条件的详情页url;2、去详情页采集信息
1.找出url汇总页,过滤出满足条件的详情页url:2.去详情页采集信息 package main import ( "fmt" "github.com/gocolly/ ...
- 微信小程序--详情页的推荐位置继续打开详情页;返回之后分享等数据不正确问题
问题背景 -- 分享的数据来源 当前在维护的小程序项目使用wepy开发:分享的数据都是通过接口请求后台的形式获得:然后存在了数据data的对象中:类似 定义分享数据 data = { shareDat ...
- Vue+koa2开发一款全栈小程序(9.图书详情页)
1.获取图书详情 1.修改server/controllers/bookdetail.js为 const {mysql}=require('../qcloud') module.exports=asy ...
- Django----使用模板系统渲染博客页面、实现列表和详情页的跳转、前后跳转功能
.模板写法同Flask,可以参考之前的FLask-模板 .将之前的BootStrap静态页面中的数据使用模板写 <!DOCTYPE html> <html lang="en ...
- mui列表跳转到详情页优化方案
原理 因为列表页到详情页是多对一的形式,即列表页的多条数据列表对应的是一个详情页,只是数据不同而:因此,可以在加载列表页时预加载详情页,即创建一个详情页的webview,但是不显示出来,点击列表的时候 ...
- mxonline实战10,课程列表页,课程详情页1
对应github地址:第10天 一. 课程列表页 1. 拷贝course-list.html到templates目录中 2. 编写url和view 在courses/views.py中新加
- vue项目实现详情页后退缓存之前的数据
vue项目实现详情页后退缓存之前的数据 2019年02月19日 14:54:57 不想写代码的程序员 阅读数:244 一.需要缓存的内容: 1.后退缓存条件查询的数据 2.后退缓存分页信息 二.实 ...
- React-Native 之 GD (十一)加载更多功能完善 及 跳转详情页
1.加载更多功能完善 GDHome.js /** * 首页 */ import React, { Component } from 'react'; import { StyleSheet, Text ...
随机推荐
- linux 查看网段内所有IP
如有转载,不胜荣幸.http://www.cnblogs.com/aaron-agu/ 方法一: nmap –nsP 192.168.1.0/24 #从192.168.1.0到192.168.1.25 ...
- SELECT IDENT_CURRENT(tableName)和自增长列的纠结
项目中要用到一个功能:主表主键为自增长,要求在插入主表数据前先获得主表要插入数据的主键ID值,用在插入子表时获取主键ID.在网上搜了一下,发现SELECT IDENT_CURRENT(TableNam ...
- 学习 Spring (十三) AOP 配置
Spring入门篇 学习笔记 Spring 所有的切面和通知器都必须放在一个 内(可以配置包含多个 元素),每一个 可以包含 pointcut, advisor 和 aspect 元素(它们必须按照这 ...
- 【RNN】资源汇总
wesome Recurrent Neural Networks A curated list of resources dedicated to recurrent neural networks ...
- Python小爬虫——抓取豆瓣电影Top250数据
python抓取豆瓣电影Top250数据 1.豆瓣地址:https://movie.douban.com/top250?start=25&filter= 2.主要流程是抓取该网址下的Top25 ...
- 使用ROME解析rss,如何获取icon图标
问题 网站使用SpringMVC框架,实现了RSS订阅,但是在阅读器里面,只有网站的标题,没有网站的图标. 分析 ROME会从<channel>标签下指定的<link>地址中, ...
- RFC2544测试指标
RFC2544测试指标 参考:https://wenku.baidu.com/view/3abbb5bf960590c69ec3769d.html RFC2544性能测试介绍 参考:https:// ...
- MT【255】伸缩变换
(2012新课标9)已知$\omega>0,$函数$f(x)=sin(\omega x+\dfrac{\pi}{4})$在$(\dfrac{\pi}{2},\pi)$上单调递减,则$\omega ...
- 【APIO2018】铁人两项(圆方树,动态规划)
[APIO2018]铁人两项(圆方树,动态规划) 题面 UOJ 洛谷 BZOJ 题解 嘤嘤嘤,APIO的时候把一个组合数写成阶乘了,然后这题的70多分没拿到 首先一棵树是很容易做的,随意指定起点终点就 ...
- photoshop学习4
蒙版 路径学习 一.蒙版 蒙版可以理解为一层在图层上的遮挡布,为什么要将图层遮住呢,有什么好处.好处在于容易编辑. 在一个图层上建立一个蒙版之后,可以用再删掉不需要的部分,从而露出原图层的部分.那么这 ...