DOMException：无法在"节点"上执行'removeChild'。使用地图渲染组件时

Question

我遇到了一个问题，因为我有一个Map，它的作用是获取值​​并将其传递给组件。此组件是一个包含产品的类别滑块。

因此，当服务响应非常快时，它没有第一次完成组件的渲染并启动另一个组件，我该如何处理它？

const getProductsWithTree = () => {
if(ifExistAndMayorToZero(tree)) {
return (
tree.map((category:any) => {
return (
<GlobalComponents.ProductSliderAsync
filterBrand={false}
singleProviderId={vendorId}
category={category}
hideMore={true}
isLoading={isLoadingProducts}
brandId={brandId}
validateIfIsHasProducts={ifIsHasProducts}
{...props}
/>
)
})
)
}
}

我想出了一些办法，比如知道我什么时候回来处理地图，但我不知道。

这不起作用，错误发生了，当它响应很快时，如果我把慢速连接放在那里，它就可以正常工作。

Answer 1

如果"服务"；引用树的源，可以将树存储在状态中，以便在树更改时重新渲染滑块。

如果它指的是一个外部服务，在它完成与树的渲染之前，它正在导致另一个组件在滑块上渲染，您可以推迟渲染所述第二个组件("另一个"(，直到滑块完成渲染。

第二种情况的简单概念化：

如果一个组件影响另一个组件的呈现，那么它们可能共享一个条件逻辑。

也许您可以通过让ProductSlider更新存储中的值(我们称之为sliderRenderIsDone(并将其添加到共享条件中来完善条件：

{ treeIsReady
? sliderRenderIsDone ? OtherComponent : ProductSlider
: null 
}