React中如何过滤已点赞用户？MongoDB数据处理问题

你当前的过滤逻辑错误在于直接将单个用户对象与整个current.liked数组比较（user !== current.liked），这完全不符合逻辑——一个是对象，一个是数组，永远不会相等。正确的做法是提取已点赞用户的唯一标识（比如secret，从你的MongoDB结构来看每个点赞项都有这个字段），再判断当前用户是否在已点赞列表中。

修改后的完整代码 #

useEffect(() => {
  async function currentUser() {
    const resp = await get(`user/${localSecret}`);
    setCurrent(resp.data);
  }
  currentUser();
}, []);

useEffect(() => {
  async function fetchAndFilterUsers() {
    if (!current) return; // 等待当前用户数据加载完成
    
    const resp = await get('api');
    // 第一步：排除当前登录用户
    const filteredSelf = resp.filter(user => user.secret !== localSecret);
    
    // 第二步：过滤已点赞用户
    if (current.liked.length > 0) {
      // 提取所有已点赞用户的secret字段
      const likedUserSecrets = current.liked.map(item => item.secret);
      // 排除secret在已点赞列表中的用户
      const filteredFinal = filteredSelf.filter(user => !likedUserSecrets.includes(user.secret));
      setAllUsers(filteredFinal);
    } else {
      // 没有已点赞用户时，直接用排除自身后的列表
      setAllUsers(filteredSelf);
    }
  }
  fetchAndFilterUsers();
}, [current]); // 依赖current，确保用户点赞数据更新后重新过滤

关键说明 #

1. 依赖current：将current加入useEffect的依赖数组，这样当当前用户的点赞列表更新时，会自动重新执行过滤逻辑，保证列表实时准确。
2. 空值判断：加入if (!current)避免在当前用户数据未加载完成时执行过滤，防止报错。
3. 唯一标识匹配：通过secret字段判断用户是否已被点赞，这是因为对象直接比较（===）会因为引用不同而失效，必须用唯一的属性值来判断。

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