如何在useEffect中判断数组项同VRN且有完成日期后跳转页面？

你需要同时满足两个核心条件：所有数组项的vrn值完全一致，且每一项的completedOn都为有效非空值。可以按以下方式修改你的useEffect逻辑：

useEffect(() => {
  // 先处理数组为空的边界情况，避免报错
  if (!maintenanceReminder.checkHistory || maintenanceReminder.checkHistory.length === 0) {
    return;
  }

  // 定义完成日期校验函数
  const hasValidCompletedOn = (item) => {
    // 可根据业务需求增强校验，比如验证合法日期格式
    return item.completedOn && item.completedOn.trim() !== '';
  };

  // 校验所有项的vrn是否一致
  const firstVrn = maintenanceReminder.checkHistory[0].vrn;
  const allSameVrn = maintenanceReminder.checkHistory.every(item => item.vrn === firstVrn);
  // 校验所有项都有有效完成日期
  const allCompleted = maintenanceReminder.checkHistory.every(hasValidCompletedOn);

  // 两个条件同时满足时执行跳转
  if (allSameVrn && allCompleted) {
    navigation.navigate(AppRoutes.MaintenanceIntroVehicleSuccess.Name);
  }
}, [maintenanceReminder.checkHistory, navigation]);

关键修改说明： #

• 边界处理：先判断数组是否存在且非空，防止取第一个元素vrn时出现undefined报错
• VRN一致性校验：取数组第一项的vrn作为基准，用every遍历所有元素确认是否完全匹配
• 完成日期有效性增强：把原来只校验completedOn非空的逻辑，调整为校验item.completedOn存在且不为空字符串
• 依赖数组修正：把maintenanceReminder.checkHistory和navigation加入依赖数组，确保数据变化时能重新触发校验

可选增强：严格日期校验 #

如果需要验证completedOn是否为合法日期格式，可以修改校验函数：

const hasValidCompletedOn = (item) => {
  if (!item.completedOn || item.completedOn.trim() === '') return false;
  const date = new Date(item.completedOn);
  return !isNaN(date.getTime());
};

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