如何做到不同的商品传来不同的数据,麻烦给个思路

来源:3-3 项目作业

迷失的小麦

2020-04-10 13:39:53

另外,axios和jsonp分别在什么场景下使用?有什么区别?这个地方推荐用哪个?


写回答

1回答

好帮手慕言

2020-04-10

同学你好,可以参考下方:
1、商品的id在你获取到热门推荐商品信息数据中已经包括了商品id, 点击商品进入详情页的时候, 也将商品id传递到详情页了。

http://img.mukewang.com/climg/5e902278096fb91d07320268.jpg

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

http://img.mukewang.com/climg/5e90228609d5d71804810059.jpg

http://img.mukewang.com/climg/5e90229009a5c2e505780051.jpg

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

拼接接口:

https://unszacs.m.taobao.com/h5/mtop.taobao.detail.getdetail/6.0/

http://img.mukewang.com/climg/5e9022c30926a3ed13370373.jpg

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

http://img.mukewang.com/climg/5e9022e809ba3a6308150332.jpg

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

另外:在不跨域的情况下可以使用axios。跨域使用jsonp。商品详情推荐使用jsonp。

祝学习愉快~

0

0 学习 · 10739 问题

查看课程