Vue的列表超链接(A标签)是什么?如何实现跳转呢?
作者:互联网
方法一:通过
<router-link :to="">我要跳转,别拦我</router-link>
首页列表:
在这里我用a标签进行跳转,在vue里面使用<router-link></router-link> //注意:这里的router-link在前台解析的时候会自动变成a标签
<router-link :to="{path:'/news',query:{ id:item.NewsID }}" class="around"></router-link>
商品详情页:
//请求接口
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); }); }
方法二:通过绑定点击事件跳转页面(比较常用,纯手写,有什么问题欢迎留下你的评论)
1 <ul> 2 <li v-for="(item,index) in items" :key="index" @click="jumpPage(item.id)">我要跳转谁也别拦我</li> 3 </ul> 4 5 data(){ 6 return:{ 7 items:[ 8 { 9 id:1 10 }, 11 { 12 id:2 13 }, 14 { 15 id:3 16 } 17 ] 18 } 19 }, 20 methods: { 21 jumpPage(id) { 22 this.$router.push({ 23 path: '路由地址', 24 query: { 25 id: id 26 } 27 }) 28 }, 29 }
标签:Vue,console,标签,超链接,跳转,newsID,query,id 来源: https://www.cnblogs.com/fu7n/p/16651645.html