问答

Vue项目,JS怎么控制一自然天里只在第一次打开的时候触发某个事

作者:admin 2021-05-13 我要评论

项目需求: 一天内只在第一次打开的时候触发某个事件? ### localStorage,然后设置过期时间做判断是否是在一天内 ### 问题分析: 需要一个标志位 ,比如flag ,...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

项目需求:
一天内只在第一次打开的时候触发某个事件?

###

localStorage,然后设置过期时间做判断是否是在一天内

###

问题分析:

需要一个标志位 ,比如flag ,记录一下某个事件被触发的时间戳。

某事件比如是点击按钮button时,alert 一句话 “hello world”。

问题是这个flag 存哪?localstorage里面,用户一清除缓存就清了。

所以这个flag 应该是存在于服务端的,然后你的项目一起来,就要去服务端去获取flag。

当去触发这个事件的时候(点击按钮),判断时间戳是不是在今天内(范围就是今天零点到点击按钮的那一刻)。

flag在这个范围内,那就是触发过了,不再alert ‘hello world’;

flag不在这个范围内,那就是今日未曾触发,alert ‘hello world’;并且设置flag=点击按钮的那一刻的时间戳。向服务端发请求,存入数据库。

上面都是新手拙见,有错误请指正哈。大家不要笑话我。。


重新整理一下语言:

当去触发这个事件的时候(点击按钮),从localstorage中获取flag的值。

1、 如果flag存在,判断时间戳是不是在今天内(范围就是今天零点到点击按钮的那一刻)。

——> flag在这个范围内,那就是今日触发过了,不再alert ‘hello world’;

——> flag不在这个范围内,说明flag的值就是今天之前的某个时间,那就是今日未曾触发,可以 alert ‘hello world’;并且设置flag=点击按钮的那一刻的时间戳。请求后台接口,将flag的值存入数据库、并且写入localstorage中(今天再点就直接从localstorage中取值了)。

2、如果flag不存在(可能是用户清除了缓存、也可能是从未点击过),请求后台接口读取flag的值。

——> 如果flag不存在,说明此处从未点击过。那就点呗。

——> 如果flag存在,那就是说用户清过缓存,那就回到1。

完了。

###

这个问题就类似于阅读隐私条款一样,第一次点击阅读,之后就不在弹出。
叫后端写一个接口,配合接口做会比较好。

###

我感觉还是第一个说的用 localStorage 最方便,前端自己全部搞定。
第一次判断有无,没有就存入并触发;
后面对比这个时间,同一天不触发,不是同一天触发,并更新这个值。

###

这个本质是需要一个标志性信息,然后vue可以利用这个标志信息。
这个信息可以是
1.从服务器端获取,
2.也可能是本地的诸如cookie、localStorage信息的处理。
但更多的是1和2的结合。

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • Vue项目,JS怎么控制一自然天里只在第

    Vue项目,JS怎么控制一自然天里只在第

  • 无法从组播端口中接收报文

    无法从组播端口中接收报文

  • egg怎么开启多个固定时间的定时任务

    egg怎么开启多个固定时间的定时任务

  • IDEA无法保存

    IDEA无法保存

腾讯云代理商
海外云服务器