我正在使用Vue。可以说，我有一个数据库表，其中包含过去几年中几种水果的历史价格，因此：水果，年份和价格列。
| fruit | year | price | |--------|------|-------| | apple | 2018 | 52 | | apple | 2019 | 57 | | apple | 2020 | 56 | | apple | 2021 | 50 | | banana | 2018 | 25 | | banana | 2019 | 26 | | banana | 2021 | 28 | | pear | 2018 | 61 | | pear | 2019 | 65 | | pear | 2020 | 67 | | pear | 2021 | 64 |
现在，我想创建一个html表，该表在一个轴上具有水果名称，在另一轴上具有年份，并且单元格包含给定水果/年组合的价格，如下所示。数据中可能缺少某些组合。
您将使用哪些功能和模板语法？请不要建议转换原始数据：它直接来自数据库，并且会有很多这样的表，我需要一个通用的解决方案。
| | 2018 | 2019 | 2020 | 2021 | |--------|------|------|------|------| | apple | 52 | 57 | 56 | 50 | | banana | 25 | 26 | n/a | 28 | | pear | 61 | 65 | 67 | 64 |
我正在寻找优雅的“类似于vue”的解决方案。现在，我创建了getRows（），getColumns（）函数来收集所有可能的行和列值，然后创建一个getCell（col，row）函数以从数据集中获取正确的值-但这可能会迫使Vue重新构建显示内容比我编辑基础数据的最佳时间要好。
更广泛的问题是您如何在Vue中处理关系数据，因为这只是基本示例，通常水果的名称将来自另一个基表...