如何在贴图函数中处理多个参照
我需要瞄准地图函数中的所有组件，但我只得到其中的最后一个组件。
products?.map((product, i) => (
<div
key={product.id}
className="product__card"
onMouseEnter={() => sliderRef.current.slickNext()}
onMouseLeave={() => sliderRef.current.slickPause()}
>
<StyledSlider {...settings} ref={sliderRef}>
{product.assets.map(({ url, id, filename }) => (
<div className="product__image__container" key={id}>
<img src={url} alt={filename} />
</div>
))}
</StyledSlider>
<div className="product__content__container">
<h3 className="slim__heading">{valueChopper(product.name, 23)}</h3>
<p contentEditable="true" dangerouslySetInnerHTML={{ __html: valueChopper(product.description, 30) }} />
<h6 className="slim__heading">Rs. {product.price.formatted}</h6>
</div>
</div>
)
共有1个答案
最简单的方法是使用一个ref以多个元素为目标。请参见下面的示例。我已经修改了你的代码使它工作。
const sliderRef = useRef([]);
products?.map((product, i) => (
<div
key={product.id}
className="product__card"
onMouseEnter={() => sliderRef.current[i].slickNext()}
onMouseLeave={() => sliderRef.current[i].slickPause()}
>
<StyledSlider {...settings} ref={el => sliderRef.current[i] = el}>
{product.assets.map(({ url, id, filename }) => (
<div className="product__image__container" key={id}>
<img src={url} alt={filename} />
</div>
))}
</StyledSlider>
<div className="product__content__container">
<h3 className="slim__heading">{valueChopper(product.name, 23)}</h3>
<p contentEditable="true" dangerouslySetInnerHTML={{ __html:valueChopper(product.description, 30) }} />
<h6 className="slim__heading">Rs. {product.price.formatted}</h6>
</div>
</div>
)
-
假设我有一个Employee类。它有很多字段，比如id、名字、姓氏、姓名、年龄、薪水和其他字段。现在，我正在进行一个Get查询，希望使用所有这些字段（required=false）作为请求参数传递。 但问题是，可能有许多组合，如（firstName， age）或（age，工资，lastName）或（指定，年龄，工资，lastName）等等。那么我应该如何处理所有这些筛选器。我必须为每个案例编写每个
-
问题内容： 在我正在使用的Web服务中，我需要使用查询参数来实现一个URI，如下所示： 要对其进行分解，我需要能够使用查询参数来指定多个/所有商店中的数据以及这些商店中多个/所有项目的数据。到目前为止，我已经能够很好地实现一个查询参数以提取项目数据，但是我对如何实现更多查询一无所知，而且似乎找不到我之前所见过的资源。通过此实现。 到目前为止，我所采用的方法是 这对于一项很有效，如果我不在URI中键
-
但我得到了NullPointerException任何人都可以帮忙
-
问题内容： 我花了一整夜的时间调试我的代码，终于找到了这个棘手的问题。请看下面的代码。 我以为我会得到，但输出是。这是没有意义的我，因为如果我有，并给我。回调可能以不同的方式工作。所以我的问题是如何获得而不是？ 问题答案： 如果使用map_async，则使用结果（）调用一次回调。 使用，如果你想被称为每次回调。
-
问题内容： 我在Linux上使用bash shell，并且要在shell脚本中使用10个以上的参数 问题答案： 使用花括号将其设置为关闭： 您还可以像这样遍历位置参数： 要么 要么
-
我很难想出一个程序，用一个包含参数值的函数在屏幕上画一个球，然后让它以恒定的速度移动。你可以看出我是个笨蛋，不太懂参数。以下是我到目前为止的情况。