javascript - 使用反应钩子单击按钮时道具不更新

Question

我不知道出了什么问题。基本上有一个过滤器组件可以通过低值或高值，并且产品旨在根据该值进行更改。第一个值更改有效，但之后 Cardlist products 道具不会更改

function ProductOverview({products, history}) {
let [productsValue, setProducts] = useState(products);


const setFilter = (value) => {
    let sortedProduct;
    if (value === 'low'){
        sortedProduct = products.sort((a, b) => a.price - b.price)
        setProducts(sortedProduct);

    }
    else if (value ==='high'){
        console.log("higg")
        sortedProduct = products.sort((a, b) => b.price - a.price)
        setProducts(sortedProduct)


    }

     

  };



return (
  <div className="product-overview">
    <Filter setValue={setFilter} />
    {products.length > 0 ? (
      <CardList products={productsValue} />
    ) : (
      <div className="empty-list">No Item</div>
    )}
  </div>
);

}

标签： javascriptreactjs