1

我尝试找到在用户进入页面时第一次显示解除警报的方法，然后当用户再次单击该页面时，它将不再显示该警报。

我使用这个网站的代码：https ://reactstrap.github.io/components/alerts/

我的代码：

    this.state = {

     hasVisitedPageBefore: false,
};

  visitPage() {
this.setState({ hasVisitedPageBefore: true });

 }

showAlert() {
return (
  <Alert color="info" isOpen={this.state.visible} toggle={this.onDismiss}>
    Congratulations! You have been created deck.
  </Alert>
);
  }


 render
{this.state.hasVisitedPageBefore ? null : showAlert}

大家知道怎么查吗？请给我建议。

谢谢

4

2 回答 2

1

您可以借助localstorage在不同页面之间保留标志

例如。从构造开始

constructor() {
 this.state = {
    hasVisitedPageBefore: localStorage.get("hasVisited") || false,
 };
}

现在将访问标志设置为

visitPage() {
    localStorage.set("hasVisited", true)
    this.setState({ hasVisitedPageBefore: true });
 }

sessionStorage如果您想为当前浏览会话保留此首选项，则可以使用。

[这只是一个想法，请原谅我的语法]

于 2017-10-27T05:42:53.370 回答
0

如果我理解正确，您想“记住”用户访问过某个页面，以便当用户再次访问时，您必须以不同的方式显示您的页面（即没有警报）。

您需要有一个状态变量hasVisitedPageBefore（或您选择的任何名称！）。false启动应用程序时将其设置为默认值。访问页面时，将变量设置为true。

然后在您的页面中，根据hasVisitedPageBeforeistrue或显示或隐藏警报false。

    <div>
      {hasVisitedPageBefore?null:<Alert>Message</Alert>}
      <MyPage />
    </div>

随意询问您是否无法弄清楚细节。

于 2017-10-27T05:04:33.493 回答