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硬盘的分区、格式化、挂载以及LVM
linux硬盘的分区.格式化.挂载以及LVM 多块硬盘的组合: 硬盘分两种:ide和scsi. ide硬盘: /dev/hda 第一块IDE硬盘 /dev/hdb 第二块IDE硬盘 ... /de ...
- DELPHI中MDI子窗口的关闭和打开
DELPHI中MDI子窗口的关闭 和打开 Delphi中MDI子窗口的关闭方式默认为缩小而不是关闭,所以当你单击子窗口右上角的关闭按钮时会 发觉该子窗口只是最小化,而不是你预期的那样被 ...
- LODOP.FORMAT格式转换【回调和直接返回值】
Lodop中有一些格式转换函数,这些函数和其他众多函数一样,c-lodop需要使用回调函数On_Return返回,Lodop插件方式直接返回,通常混合部署,写法要兼容两个控件.可以用if (LODOP ...
- How to recovery compiz
sudo apt install compizconfig-settings-manager dconf reset -f /org/compiz/ setsid unity dconf list / ...
- hdu-1711(kmp)
题意:给你两串数字,问你第二串数字第一次出现在第一串数字的位置,没有输出-1: 解题思路:其是就是字符串匹配,就是这里是数字匹配,把char数组改成int型就可以了: 代码: #include< ...
- 实现中英文混合string的逆向输出
#include <iostream> using namespace std; // 输入一个字符串(包括英文和中文),将其反序输出, 如: // hello 今天真热 ---> ...
- python 文件下载
为了演示urllib3的使用,我们这里将会从一个网站下载两个文件.首先,需要导入urllib3库: import urllib3 这两个文件的源url为: url1 = 'http://earthqu ...
- CSAPC2008 skyline
一座山的山稜线由许多片段的45度斜坡构成,每一个片段不是上坡就是下坡. * * * /\* /\ /\/ \/\/ \/ \ 在我们眼前的所见的任何宽度为n个单位的 ...
- 微信小程序API 文档快速参考索引
内容那么多,这个页面到底做了什么? 第一:解决微信文档APi文档使用不便: 第二:解决了内容搜索与索引:—— 最好是写成全文索引文档,但是比较需要时间,而且更新是一件麻烦的事:所以以下是直接 连接官网 ...
- 【UVALive - 6534 】Join two kingdoms (树的直径的期望)
bupt spring training for 2015 #2nd J 题意 给两棵树,分别有 n,m 个节点(1 ≤ N, Q ≤ 4 × 10^4),等概率连接属于不同树的两个节点,求新树的直径 ...