Javascript 如何使用onClick方法删除对象并更新数组

我正在从skidList数组创建列表，并在每个撬块上处理复制和删除操作，以及单击delete按钮，我正在调用

deleteSkid

方法，该方法在该索引处移除撬块并更新列表

但是，它不会删除特定索引处的撬块，而是删除数组列表中的最后一个撬块

const CreateNewTab=（）=>{
const[skidList，setSkidList]=useState（[]）；
常量[productNameMap，setproductNameMap]=useState（{}）；
useffect（（）=>{
让列表=[]；
让newSkid={}；
新闻儿童[“2”]=“0”；
新闻儿童[“3”]=“0”；
新闻儿童[“4”]=“0”；
推送（新闻儿童）；
设置撬块列表（[…撬块列表]）；
让productNameMap={}；
productNameMap[“2”]=“笔”；
productNameMap[“3”]=“铅笔”；
productNameMap[“4”]=“橡皮擦”；
setproductNameMap（{…productNameMap}）；
}, []);
const updateProductQuantity=（滑动、键、新数量、索引）=>{
控制台日志（“内部更新撬块数量索引=”+索引）；
撬块[键]=新数量；
let newSkidList=skidList；
拼接（索引，1，撬块）；
console.log（newSkidList）；
设置基类列表（[…新闻基类列表]）；
};
常数deleteSkid=（索引）=>{
控制台日志（索引）；
let newSkidList=skidList；
剪接（索引，1）；
console.log（“从“+newSkidList”中删除的撬块）；
设置基类列表（[…新闻基类列表]）；
};
常数插入滑轨=（滑轨）=>{
setSkidList（skidList.concat（[{…skid}]）；
};
返回(
{skidList.flatMap（（滑动，索引）=>(
{Object.keys（滑动）.map（（键）=>(
{productNameMap[key.toString（）]}
{
更新产品数量（撬块、键、新数量、索引）；
}}
/>
))}
插入式滑轨（滑轨）}
/>
删除（索引）}
/>
}
))}
);
};

这似乎与react如何回收dom或其他东西有关，该项确实会从数组中删除，但不知何故，该值会保留在dom中，因为您在输入中使用了

defaultValue

而不是

value

，进行此小更改，它就会工作

value={skid[key]}

---

这似乎与react如何回收dom或其他东西有关，该项确实从数组中删除了，但不知何故，该值保留在dom中，因为您在输入中使用了

defaultValue

而不是

value

，进行此小更改，它就会起作用

value={skid[key]}

---

您的

deleteSkid（）

实现很好， 但是将值作为

defaultValue

传递给

InputNumber

，这样在组件重新渲染时它不会改变。 只需将其替换为

值

，它就会正常工作

<InputNumber
  min={0}
  value={skid[key]}
  rules={[
    {
      required: true,
      message: "Please input quantity!"
    }
  ]}
  onChange={(newQuantity) => {
    updateProductQuantity(skid, key, newQuantity, index);
  }}
/>

{
更新产品数量（撬块、键、新数量、索引）；
}}
/>

您的

deleteSkid（）

实现很好， 但是将值作为

defaultValue

传递给

InputNumber

，这样在组件重新渲染时它不会改变。 只需将其替换为

值

，它就会正常工作

<InputNumber
  min={0}
  value={skid[key]}
  rules={[
    {
      required: true,
      message: "Please input quantity!"
    }
  ]}
  onChange={(newQuantity) => {
    updateProductQuantity(skid, key, newQuantity, index);
  }}
/>

{
更新产品数量（撬块、键、新数量、索引）；
}}
/>

为什么要使用

.flatMap

？我试过使用.map，但也有同样的问题。你试过在

flatMap

内的父元素上使用

键

道具吗？是的，我试过按照你的建议使用键道具。这不能解决问题，这能回答你的问题吗？你为什么要使用

.flatMap

？我试过使用.map，但也有同样的问题。你试过像这样在

flatMap

中的父元素上使用

键
道具吗？是的，我试过按照你的建议使用键道具。这不能解决问题，这能回答你的问题吗？谢谢你，迭都。你让我开心！如果你在多伦多或将来要来，我很乐意给你拿杯咖啡。谢谢你@diedu。你让我开心！如果你在多伦多或将来要来，我想给你拿杯咖啡。