Javascript “显示”；“你好”；仅在首次加载时

我试图只在第一次加载时显示文本“Hello”。若用户关闭窗口并再次打开，那个么它将再次显示。但在窗口中导航到页面时，不应显示“Hello”

情景：

• 输入url:/hello
• 显示“你好”
• 输入url:/再见
• 输入url:/hello
• 不要说“你好”
• 关窗
• 开窗
• 输入url:/hello
• 显示“你好”

我正在使用e

unload

事件进行的尝试：

const firsttime = localStorage.getItem('firsttime')
useEffect(() => {
  window.addEventListener('unload', () => {
    localStorage.removeItem('firsttime')
  })
  const t = setTimeout(() => {
    localStorage.setItem('firsttime','1')
  },2000)
  return () => {
    clearTimeout(t)
    window.removeEventListener('unload', null)
  }
},[firsttime])
return !firsttime && "Hello" || null

---

当我导航到页面时，它工作正常，第一次显示“Hello”，之后就不再显示了。但是当我直接输入url（它被刷新）时，会显示“Hello”。我不想在刷新时显示“你好”。我只想在窗口关闭并再次打开时显示它。因此，我如何检测第一次打开的窗口以及关闭后的窗口。我希望你能理解我的问题。谢谢。

最简单的解决方法是首先检查您是否访问过该页面，然后如果没有提醒您好，则将visited设置为true。然后在关闭窗口时，将visited设置为false。下一次打开时，它会提醒hello。这包括jquery

$（文档）.ready（函数（）{
如果（！localStorage.visted）{
警报（“你好”）
localStorage.visted=true；
}
});
window.onbeforeunload=函数（）{
localStorage.visted=false；
}

---

考虑使用

会话存储

而不是

本地存储

---

请参见

我认为您使用localStorage的方法是正确的，您可能只需要确定它何时实际执行您的代码

onload事件的事件监听器应该在react组件之外，我认为应该使用主应用程序初始化它

那么我建议您在显示第一条消息时设置访问标志

编辑1 经过进一步的研究，问题似乎可能是您的卸载事件。似乎刷新和关闭页面都会触发此事件。因此，问题似乎是撤除国旗，在这一点上，它将一直发生。我想知道你是否可以放置一个计时器，比如存储访问它的时间，并在每次加载页面时进行比较，只在5分钟左右后显示Hello

编辑2 我在看另一个答案： 我修改了代码，我认为这应该行得通：

window.addEventListener（'unload'，（）=>{
localStorage.removietem（'pagevisted'）；
});
var MyHelloOnFirstLoad=React.createClass({
getWellcomeMessage（）{
让pageHasBeenVisited=localStorage.getItem（'pageVisited'）==1；
if（pageHasBeenVisited | | performance.navigation.type==performance.navigation.type_重载）
{
返回null；
}
setItem（'pageVisited'，'1'）；
回复你好；
},
render（）{
返回(
{this.getWellcomeMessage（）}
);
}
});我无法使用本地存储为什么不创建一个返回hello的函数，然后调用onload？我尝试了onload，但无法达到预期效果，所以尝试了使用localStorage，但仍然没有帮助。我认为在窗口关闭时卸载就可以了，如何操作？在第一次加载时为用户提供一个本地存储cookie，并在下一次加载时检查该cookie；只要用户不清除缓存，他们就不会再看到Hello。实际上，这是当前窗口卸载时。重新加载页面将卸载当前窗口。关闭选项卡将首先卸载当前窗口。这将不起作用，刷新页面时也会触发onload。顺便说一句，我没有投反对票。@gacat这个解决方案正是你想要的，希望它能有所帮助。谢谢你的帮助。但说真的，这是行不通的。我也尝试过BeforeUnload。你还需要帮助吗？或者你找到答案了吗？放弃，谢谢你的帮助“Hello”仍然显示在页面刷新上。你对charlietfl的评论怎么看<代码>实际上是当前窗口卸载时。重新加载页面将卸载当前窗口。关闭选项卡将首先卸载当前窗口

他完全正确，这个答案不正确XDI刚刚添加了一个额外的检查，以查看页面是否重新加载，我学到了一些XD。这假设如果您正在重新加载页面，那么您已经访问了该页面。我想你可以把那一行额外的代码添加到你的原始代码中。我甚至没有运气。不管怎样，我明天会再试一次，让你知道。现在要去睡觉了。