vue列表到详情页的实现
路由里边的 router/index.js path:'/detail/:id' 动态id
列表页渲染时:
:to="'/detail/'+item.id" ===>id是指请求文章列表的id,可以是aid,bid等等 请求列表接口:http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page=1 点击进入路由变http://localhost:8080/#/detail/456 详情页需要请求文章详情的接口 http://www.phonegap100.com/appapi.php?a=getPortalArticle&aid=456, 传入 this.$route.params.id 和路由里面一样的id写死 mounted(){ var aid=this.$route.params.id;
//console.log(aid) //调用请求数据的方法 this.requestData(aid);
},
methods:{ requestData(aid){ //get请求如果跨域的话 后台php java 里面要允许跨域请求 var api='http://www.phonegap100.com/appapi.php?a=getPortalArticle&aid='+aid; this.$http.get(api).then((response)=>{
console.log(response); this.detail=response.data.result[]; //根据数据结构赋值 },(err)=>{ console.log(err)
})
}
}
vue列表到详情页的实现的更多相关文章
- vue项目实现详情页后退缓存之前的数据
vue项目实现详情页后退缓存之前的数据 2019年02月19日 14:54:57 不想写代码的程序员 阅读数:244 一.需要缓存的内容: 1.后退缓存条件查询的数据 2.后退缓存分页信息 二.实 ...
- 微信小程序页面列表与详情页跳转的正确姿势
初学小程序,碰到列表与详情页跳转遇到的问题,记录一下. 一.问题 1个列表页: 1个详情页: 列表页代码: onLoad:异步查询数据并setData 详情页代码: 保存成功后,调用navigateB ...
- Django----使用模板系统渲染博客页面、实现列表和详情页的跳转、前后跳转功能
.模板写法同Flask,可以参考之前的FLask-模板 .将之前的BootStrap静态页面中的数据使用模板写 <!DOCTYPE html> <html lang="en ...
- vue 默认展开详情页
{ path: '/Tree', component: Tree, children: [ { path: '/', component: Come } ] }
- vue学习之用 Vue.js + Vue Router 创建单页应用的几个步骤
通过vue学习一:新建或打开vue项目,创建好项目后,接下来的操作为: src目录重新规划——>新建几个页面——>配置这几个页面的路由——>给根实例注入路由配置 src目录重整 在项 ...
- VUE通过id从列表页跳转到相对的详情页
新闻列表页面: 在这里我用a标签进行跳转,在vue里面可以这样写<router-link></router-link> 1 <router-link :to=" ...
- vue项目实现列表页-详情页返回不刷新,再点其他菜单项返回刷新的需求
问题背景:有时候一些列表会有一些跳转的需求,比如跳到详情页.或者是其他相关的页面(比如跳到用户列表去查看用户的相关信息)等,此时再返回列表页,列表页会刷新重置.目前需求就是需要改成如下情况: 问题1. ...
- vue通过id从列表页跳转到对应的详情页
1. 列表页:列表页带id跳转到详情页 详情页:把id传回到后台就可以获取到数据了 2.列表页跳转到详情页并更改详情页的标题 列表页:带id和页面标题的typeid跳转到详情页 详情页:在html绑定 ...
- vue keep-alive 实现详情返回列表保留页面数据
实现功能 详情页返回列表页,列表页保留上次浏览位置 其它页面进入到列表表,列表页刷新 当详情页有数据改变时,列表页也要更新该条数据 实现思路 用keep-alive保留列表页面数据 activated ...
随机推荐
- MySql中的视图的概念及应用
视图的基本概念 视图是从一个或几个基本表(或者视图)导出的表.它与基本表不同,是一个虚表. 数据库只存放视图的定义,而不存放视图对应的数据,这些数据仍存放在原来的基本表中.所以基本表中的数据发生变化, ...
- 树莓派 Learning 002 装机后必要的操作 --- 10 实现本地电脑与远程桌面之间复制粘贴(传输)文件
树莓派 装机后必要的操作 - 实现本地电脑与远程桌面之间复制粘贴(传输)文件 我的树莓派型号:Raspberry Pi 2 Model B V1.1 装机系统:NOOBS v1.9.2 PC端系统:w ...
- 面试题18(一):在O(1)时间删除链表结点
// 面试题18(一):在O(1)时间删除链表结点 // 题目:给定单向链表的头指针和一个结点指针,定义一个函数在O(1)时间删除该 // 结点.链表结点与函数的定义如下: // struct Lis ...
- kinect2跑高博的orbslam2的过程(仅供自己参考记录)
首先感谢高博的无私奉献!http://www.cnblogs.com/gaoxiang12/p/5161223.html 程序所在的目录为:/home/zty/catkin_ws/src/iai_ki ...
- (JAVA)String类型的逻辑语句编译
项目中遇到了动态配置条件触发相应事件的需求,需要根据String类型的逻辑语句,以及动态获取的数据,计算数据对应的结果,java实现.解决思路及代码实现如下,有需要的同学请自取. 一.需求提取 根据需 ...
- ARC085F(动态规划,线段树)
#include<bits/stdc++.h>using namespace std;const int maxn = 0x3f3f3f3f;int mn[801000];int cost ...
- PAT1098【插入排序+堆排序】
简单插入排序: 简单插入排序的核心思想: 把一条这么个难看的序列默认分为两个排好序的和未排好序的两个部分: 所以一开始排好序的只有一个a[0](好看的只有一个),难看的有N(数组长度)-1个a[1,n ...
- 洛谷P2294 [HNOI2005]狡猾的商人
P2294 [HNOI2005]狡猾的商人 题目描述 输入输出格式 输入格式: 从文件input.txt中读入数据,文件第一行为一个正整数w,其中w < 100,表示有w组数据,即w个账本,需要 ...
- java中pojo对象首字母大写导致无法赋值问题
命名规范(文末附有java命名规范)中指出,属性变量命名应采用驼峰命名的方式,即首字母小写,其他单词首字母大写: 但有时候我们对接三方的接口时,想要封装实体类来接受,但是发现接收到的参数的变量首字母是 ...
- Python中list作为默认参数的陷阱
在Python中,作为默认参数的一定要是不可变对象,如果是可变对象,就会出现问题,稍不注意,就会调入陷阱,尤其是初学者,比如我(┬_┬). 我们来看一个例子. def add(L=[]): L.app ...