React中最新产品筛选功能失效问题求助

你的「最新产品」筛选器失效的核心原因是**createdAt是嵌套对象结构，而非直接可用于减法运算的数值**。从你提供的产品结构来看，createdAt的格式是：

"createdAt": {
  "$date": {
    "$numberLong": "1662388390011"
  }
}

你当前的代码直接用b.createdAt - a.createdAt，实际上是在对两个对象做减法，结果会是NaN，导致sort函数无法正确排序，产品列表自然没有变化。

修复代码 #

将「最新产品」的排序逻辑修改为提取嵌套的时间戳数值后再比较：

console.log(sort)
if (sort === "newest") {
  setFilteredProducts((prev) =>
    [...prev].sort((a, b) => {
      // 提取并转换时间戳为数字
      const aTime = Number(a.createdAt.$date.$numberLong);
      const bTime = Number(b.createdAt.$date.$numberLong);
      return bTime - aTime; // 降序排列，最新的在前
    })
  );
  
} else if (sort === "descending") {
  setFilteredProducts((prev) =>
    [...prev].sort((a, b) => a.price - b.price)
  );
} else {
  setFilteredProducts((prev) =>
    [...prev].sort((a, b) => b.price - a.price)
  );
}
}, [sort]); 

额外验证点 #

• 确保所有产品的createdAt结构一致，不存在缺失$date或$numberLong的情况
• 可以在排序函数里加console.log(aTime, bTime)，确认时间戳数值正确提取

内容的提问来源于stack exchange，提问作者Suleyman Eminbeyli