Question

我目前正在研究基于类的功能。尝试将类转换为无状态函数，然后将每个事件处理程序的代码从this.SetState重构为useState（在本例中为setMovies）。

这是我的代码（部分代码）：

<svg #batteryIcon width="95%" height="95%" viewBox="0 0 260 399">
    <defs>
        <linearGradient [id]="batteryLinearGradientId" x1="0.5" y1="1" x2="0.5" y2="0">
            <stop offset="0%" stop-color="royalblue" />
            <stop [attr.offset]="value + '%'" stop-color="royalblue" />
            <stop [attr.offset]="value + '%'" stop-color="yellow" />
            <stop offset="100%" stop-color="yellow" />
        </linearGradient>
    </defs>
    <svg:rect [attr.fill]="'url(#' + batteryLinearGradientId + ')'" x="-30" y="0" width=25% height="100%"></svg:rect>
</svg>

似乎无法过滤此状态。我可以更改为布尔值，但无法过滤我的数组。有没有办法使用钩子进行过滤？

谢谢。

Answer 1

什么都没有改变...

const List = () => {
    const [items, setItems] = useState([1, 2, 3, 4, 5, 6])
    const filterEvenResults = setItems(items.filter(x => x % 2))
    return (
        <div>
            {
                items.map(item => <p key={item}>{item}</p>)
            }
            <button onClick={filterEvenResults}>Filter</button>
        </div>
    )
}

Answer 2

无论如何，解决了忘记删除它的问题，因为它无法在无状态函数中工作。

如何用钩子过滤数组？

2 个答案: