vue 电商选择规格

最近在写一个Vue的项目,在此项目中遇到了个很狗血的问题,在选择商品的时候选择商品的规格。规格这个东西我还是挺了解的,但是这个规格的数据让我头疼了好久。一路磕磕碰碰写出来了一个方法,数据结构是这样的。



这只是最平常的数据结构

这条数据里有两条对象,一条是尺寸,一个是颜色。有些商品会有更多的规格,就代表有更多对象。


规格的格式

这是规格的数据,下面的规格也是这样的。要写一个完美的方法,可以适应所以的商品选择规格,并不能只针对这个商品选择规格。



使用for in 循环

这里循环的是规格的条数,使用一个对象接收,键是商品的规格数,比如一个这个商品有尺寸,颜色,加绒.....,这条对象就会有多少个。这样就解决了商品有多少规格的问题,我觉得这点很好理解。


别喷我命名的问题,为了写这个特意改的方便看懂

这里就直接使用v-for渲染数据,使用了两层循环,选择商品规格的时候加上点击事件。点击商品规格的时候请求商品的价钱,去某宝,某东选择商品规格的时候也是这样的根据不同的规格显示不同的价格。点击事件传下标,event对象,点击的规格。


接口打了一下马赛克

循环数据有过失规格,用来接收点击的规格,是不是很完美。别只看,这是种思想,模仿一下试试。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容