Question

这有点缠绵。

我想要有关如何实现删除按钮功能的建议。我是刚刚起步的新人，应该在开始之前就计划好这个项目。无论哪种方式，我现在都在这里，并在明天删除功能之前寻求一些建议。

在此组件中，我创建一个称为“ displayFood”的方法，在该方法中，我从道具中获取一个数组，该数组中包含用户想要添加到冰箱中的食物名称的字符串值。例如：[酸奶，牛奶，鸡蛋，酸奶，酸奶]。然后，我创建一个对象，该对象根据名称和数量将此数组映射到键值对，例如：{“酸奶”：3，“牛奶”：1，“鸡蛋”：1}。之后，我创建一个数组，该数组保存要呈现给用户的内容，即用户放入冰箱中的每个物品以及该物品的数量。我也有一个删除按钮。我一直在考虑如何删除项目，但不知道该怎么做。

例如，如果用户删除酸奶，我希望该值减少一，并且如果用户删除数量为1的商品，则该商品应消失。

这是一个非常具体的问题，谢谢您的宝贵时间。

// At the first statement you dont really need Administrator Perms as MANAGE_WEBHOOKS is enough
// Also you forget the ! in front of the check so it would return the error message only if the Bot did  have Permissions to edit the Webhook
if(!message.member.guild.me.hasPermission(['MANAGE_WEBHOOKS'])) return message.channel.send('I don\'t have the permissions to make webhooks, please contact an admin or change my permissions!');
// To check if the Member is Admin or Has Webhook Manager you only need to check for WebHook as Administrator already gives manage_webhooks 
if (!message.member.hasPermission(['MANAGE_WEBHOOKS'])) return message.channel.send('You need to be an admin or webhook manager to use this command.');

Answer 1

您的问题是您正在尝试从组件内部更改道具。您可以使用状态在组件内部处理此问题，也可以通过父组件的props进行回调并在那里处理删除操作，例如：

<button onClick={()=>{this.props.handleRemove(Object.keys(counts)[index])}} name={Object.keys(counts)[index]}>Remove</button>

在父母渲染中：

<InFridge handleRemove={(item)=>{foodAddedByUser.delete(item)} foodAddedByUser={foodAddedByUser} />

回应有关创建删除功能的设计问题

1 个答案: