写一个 listData数组里面有多个对象 点击一个listData数组里面的对象之后把他添加到另外一个designateList空数组里面,那个加进来的对象加一个键值对,键值对的value是个数字,再次点击listData数组里面的对象,如果designateList数组里面有这个对象那就这个对象加进来的那个属性值加1
时间: 2023-05-12 21:03:47 浏览: 180
两个list比较 取不同的对象
4星 · 用户满意度95%
好的,这是一个比较常见的前端开发问题,可以使用以下代码实现:
```javascript
// 定义 listData 数组
const listData = [
{ id: 1, name: '对象1' },
{ id: 2, name: '对象2' },
{ id: 3, name: '对象3' },
];
// 定义 designateList 空数组
const designateList = [];
// 定义点击事件处理函数
function handleClick(item) {
// 判断 designateList 数组中是否已经存在该对象
const index = designateList.findIndex((i) => i.id === item.id);
if (index !== -1) {
// 如果已经存在,则将该对象的属性值加1
designateList[index].value += 1;
} else {
// 如果不存在,则将该对象添加到 designateList 数组中,并添加一个键值对
designateList.push({ ...item, value: 1 });
}
}
// 绑定点击事件
listData.forEach((item) => {
const button = document.createElement('button');
button.innerText = item.name;
button.addEventListener('click', () => handleClick(item));
document.body.appendChild(button);
});
```
这段代码会在页面上创建三个按钮,分别对应 listData 数组中的三个对象。当点击某个按钮时,会将该对象添加到 designateList 数组中,并添加一个键值对,键为 value,值为 1。如果该对象已经存在于 designateList 数组中,则会将该对象的 value 属性值加1。
阅读全文