vue详情页获取列表页内容（多个对象获取，无接口） vue

1.列表页Shop.vue添加@click事件带参

文章图片 {{shopList.name}} 【vue详情页获取列表页内容（多个对象获取，无接口）】￥{{shopList.money}}

2.在列表页方法里面query传递参数

methods: { jumpPage(id,img,name,money,content){ this.$router.push({ path:'/shoplists',//这是要跳转过去的详情页 query: { id:id, img:img, name:name, money:money, content:content } }) } } }

3.详情页Shoplists.vue获取数据

data () { return { id:'', img:'', name:'', money:'', content:'' } }

created () { this._getlistshop() //console.log(this) console.log(this.$route.query) },

methods: { _getlistshop() {this.name=this.$route.query.name this.money=this.$route.query.money this.img=this.$route.query.img this.content=this.$route.query.content}, },

4.详情页渲染