如何用Vue技术实现商品详情页的评价列表展示功能？

本文共计1008个文字，预计阅读时间需要5分钟。

本篇我们来实现商品详情页的评价列表。所需数据如下，这里以一个数据为例，说明这些数据是如何绑定到模板中的。

数据来自Foods组件，选择商品后，跳转到评价列表页面。

示例数据：json{ rateList: [ { userName: 用户1, userAvatar: https://example.com/avatar1.jpg, rateScore: 5, rateContent: 商品质量很好，物流也很给力。, rateTime: 2021-12-01 10:00 }, { userName: 用户2, userAvatar: https://example.com/avatar2.jpg, rateScore: 4, rateContent: 包装完好，但味道略淡。, rateTime: 2021-12-02 15:00 } ]}

本篇我们来实现商品详情页的评价列表。

必要的数据

这里咱们举一个数据的例子，明明白白地了解这些数据是如何绑定到模板中的。

数据来自于Foods父组件，当我们选中商品，跳转到商品详情页，那么就需要依赖父组件中的商品数据，在商品详情页面展示评论，当然也可能没有如下“rating”数据。