Vue3 查找并标记重复对象：高效解决方案

"要在 Vue3 中标记重复值，您可以使用以下步骤：\n\n1. 创建一个 Vue3 组件，并在组件的 data 选项中定义一个对象集合，例如：\njavascript\ndata() {\n return {\n items: [\n { id: 1, name: 'Apple' },\n { id: 2, name: 'Banana' },\n { id: 3, name: 'Apple' },\n { id: 4, name: 'Orange' },\n { id: 5, name: 'Banana' }\n ],\n duplicateItems: []\n }\n}\n\n\n2. 在组件的 mounted 生命周期钩子函数中，使用 reduce() 方法和 findIndex() 方法来找到重复的项，并将其添加到 duplicateItems 数组中：\njavascript\nmounted() {\n this.duplicateItems = this.items.reduce((acc, curr, index, array) => {\n if (array.findIndex(item => item.name === curr.name) !== index && !acc.includes(curr)) {\n acc.push(curr);\n }\n return acc;\n }, []);\n}\n\n\n3. 在模板中，可以使用 v-for 指令来遍历 duplicateItems 数组，并显示重复的项：\nhtml\n<template>\n <div>\n <ul>\n <li v-for="item in duplicateItems" :key="item.id">{{ item.name }}</li>\n </ul>\n </div>\n</template>\n\n\n这样，重复的项就会被标记并显示在页面上。\n