<ul> <li v-for="item in alllist"> <!--点击跳转到详情--> <a v-link="{ name: 'listDetail',params:{id: item.id }}"> {{item.title}}<!--标题 --> </a> </li> </ul>
script。
<script> export default{ data(){ return{ alllist:[] } }, route:{ data({to}){ return Promise.all([ //获取数据 this.$http.get('http://192.168.0.1/knowledge/list',{'websiteId':2,'pageSize':5,'pageNo':1,'isTop':1}) ]).then(function(data){ return{ //将获取到的数据复制给allllist数组 alllist:data[0].data.knowledgeList } },function(error){ //error }) } } } </script>
详情页代码
<div v-if="!$loadingRouteData"> <p>{{listDetail.title}}</p> <p><span>阅读：{{listDetail.viewTimes}}</span><span>发布时间: {{listDetail.publishTime | timer}}</span></p> <div> {{{listDetail.content}}}<!--读取富文本信息--> </div> </div> <script> export default{ data() { return{ listDetail:[], routeid:'' //若不是走路由，采用另一种方式获取 //routeid:this.$route.query.id } }, route:{ //id:来源于a标签的参数 data ({to:{params:{ id}}}) { var that = this ; that.$set('routeid',id)//获取id return Promise.all([ that.$http.get('http://192.168.0.1/rest/knowledge',{'id':id}), ]).then(function(data){ console.log(data) return{ listDetail:data[0].data.knowledge, } }) } }, methods:{ collect(){ } }, ready(){ var that = this; console.log(that.$get('routeid')) //得到传进来的id } } </script>
此时router要做下修改
'/list':{ name:'list', component:GetReceipt }, '/listDetail/:id':{ name:'listDetail', component:GetReceiptDetail }