第 16 课：显示最后刷新时间

日期：2026-09-21
课程序号：第 16 课
知识点：显示最后刷新时间

用途或适用场景

让用户辨认最近一次成功刷新。

核心概念

仅在 load() 成功后记录 lastSuccess；刷新失败时保留上一次成功时间。

最小代码或操作示例

text

const [lastSuccess, setLastSuccess] = useState<Date | null>(null);
async function reload() {
  setRefreshing(true);
  try { await load(); setLastSuccess(new Date()); }
  catch { Alert.alert("刷新失败", "请稍后重试"); }
  finally { setRefreshing(false); }
}
<Text>{lastSuccess ? `上次成功：${lastSuccess.toLocaleTimeString()}` : "尚未成功刷新"}</Text>

3～5 分钟练习

让刷新失败后保持旧时间。

参考答案

失败分支不更新 lastSuccess；界面仍显示上一次成功时间。

与上一课的联系

沿用第 15 课由 refreshing 控制的 reload 重试流程；本课只新增成功后更新 lastSuccess 并用 Text 显示；完成练习后下一课可为同一重试按钮提供明确的无障碍名称。

时效校验

时效校验：2026-09-24（React Native 0.87 当前文档；Text 与 React useState 当前用法未见废弃说明）。