2回答

好帮手慕星星

2020-04-06

同学你好，问题解答如下：

1、在recommend.vue中设置了，之前回复中有粘贴图哦

2、this.$route主要是用来访问路由的，可以看一下官方文档：

https://router.vuejs.org/zh/guide/#javascript

3、url链接还需要配置，代码中设置的没有问题，可以获取到数据

建议看看recommend.vue中是否写了id，否则获取不到对应的数据哦，自己再测试下。

祝学习愉快！

0

好帮手慕糖

2020-03-31

同学你好，是想要详情页面的接口吗？

这个每个商品的详情是不一样的。是通过商品id来区分的，所以需要传递每个商品的id来确认连接。不是一个固定的链接，是需要拼接的。流程可以参考如下：

1、商品的id在你获取到热门推荐商品信息数据中已经包括了商品id， 点击商品进入详情页的时候， 也将商品id传递到详情页了。

2、可以在详情页通过this.$route.params.id获取传入的品id，示例：可以详情页打印查看结果

3、在api文件夹下新建一个product.js文件封装一个函数getProductDetail根据商品id获取商品信息

拼接接口：https://unszacs.m.taobao.com/h5/mtop.taobao.detail.getdetail/6.0/

4、在商品详情组件中（也就是product文件夹下index.vue中）引入文件， 调用函数传入商品id， 获取详情数据

之后可以处理这些数据，渲染到详情组件中，实现点击不同的商品展示对应的商品详情。

祝学习愉快~

0

hyrena3447375

h <template> <me-slider :data="sliders" :direction="direction" :interval="interval" :loop="loop" :pagination="pagination"> <swiper-slide v-for="(item,index) in sliders" :key="index"> <img class="swiper-img" :src="item.picUrl" alt=""> </swiper-slide> </me-slider> </template> <script> import MeSlider from 'base/slider' import {getProductMsg} from 'api/product' import {swiperOptions} from './config' export default { name: 'ProductSlider', data() { return { sliders: [], direction: swiperOptions.direction, interval: swiperOptions.interval, loop: swiperOptions.loop, pagination: swiperOptions.pagination } }, components: { MeSlider }, created() { this.getProductDetail(this.$route.params.id) }, methods: { getProductDetail(id) { return getProductMsg(id).then(data => { this.sliders = data console.log(data) }) } } } </script>

h020-04-05

共4条回复