利用localStorage让首页弹框只在页面出现一次

我会带着你远行 2022-12-02 13:41 174阅读 0赞

<div v-if="isShow">
            
            <div class="opacity-back"></div>
            
            <div class="model-box">
                <div class="model-header">
                    <span class="close" @click="close">×</span>
                </div>
                <div class="model-body">
                    <a :href="plaqueObj.webClickUrl" target="_blank"><img :src="plaqueObj.picUrl" alt=""></a>
                </div>
            </div>
        </div>

<script>
      export default { 
        data() { 
          return { 
            isShow: false,
            plaqueObj: { }
          }
        },
        created(){ 
          var that = this
          that.haha()
        },
        methods: { 
          close() { 
            localStorage.setItem('look', 'false')
            this.isShow = false
          },
          async haha() { 
            const res = await this.getPlaque()
            console.log(res)
            if (res.data.list.length !== 0) { 
              if (localStorage.getItem('look') !== null) { 
                this.isShow = false
              } else { 
                this.isShow = true
                this.plaqueObj = res.data.list[0]
              }
            } else { 
              this.isShow = false
            }
          },
          getPlaque() { 
            let urlParams = { 
              status: 1,
              pageNum: 1,
              pageSize: 1,
              type: 1
            }
            return new Promise((resolve, reject) => { 
            this.$utils.getJson(this.$utils.CONFIG.api.plaqueList, function (res) { 
              resolve(res)
            }, function (error) { 
              reject(error)
            }, { }, false, urlParams, 'get',{ })
          })
          }
        }
      }
    </script>

发表评论取消回复

表情：

评论列表（有 0 条评论，174人围观）

还没有评论，来说两句吧...

相关阅读

相关只出现一次的数字

> leetcode 136题 \[easy\] > 中：[只出现一次的数字][Link 1] > 英：[Single Number][] > ![在这里插入图片描

以你之姓@/ 2022年12月29日 01:38/ 0 赞/ 206 阅读

相关利用localStorage让首页弹框只在页面出现一次

<div v-if="isShow">  <di

我会带着你远行/ 2022年12月02日 13:41/ 0 赞/ 175 阅读

相关京东首页之页面顶部、Logo&搜索框

京东首页之页面顶部、Logo&搜索框昨天我们主要讲了京东首页的基本布局，今天我们主要来逐步实现京东首页的页面顶部、Logo&搜索框。首先我们来看下我们今天将要实

太过爱你忘了你带给我的痛/ 2022年07月13日 13:55/ 0 赞/ 248 阅读

相关 localStorage实现弹窗只显示三次

起因：公司经常做活动，所以需要首页弹出弹窗显示活动，提醒用户参加，所以最近经常有弹窗显示。但是有时候弹窗的显示只是提醒用户，并要求每天只显示三次（每天进来的前三次，

末蓝、/ 2022年05月27日 03:19/ 0 赞/ 215 阅读

相关只出现一次的数字

> 给定一个非空整数数组，除了某个元素只出现一次以外，其余每个元素均出现两次。找出那个只出现了一次的元素 > 例：\[1,2,2\] —> 1 方法一

你的名字/ 2022年04月16日 02:09/ 0 赞/ 252 阅读

相关 JS控制页面只刷新一次!!一次!!!!

让页面进行刷新，可以使用location.reload()方法，但是这种方法会让页面一直不断的刷新，这是因为当页面加载完成以后，我们让它刷新一次，那么浏览器就会重新向服务器请求

绝地灬酷狼/ 2022年03月09日 15:24/ 0 赞/ 1081 阅读

相关 js 只刷新一次页面

第一种方法: function reurl() \{ url = location.href; //把当前页面的地址赋给变量 url

缺乏、安全感/ 2021年11月10日 07:24/ 0 赞/ 442 阅读

相关只出现一次的数

给定一个整数数组 nums，其中恰好有两个元素只出现一次，其他所有元素均出现两次。找出只出现一次的那两个元素。示例: 给定 nums = \[1, 2, 1, 3,

水深无声/ 2021年09月26日 15:10/ 0 赞/ 432 阅读

相关 php弹窗公告只登陆显示一次,JavaScript_js 弹出框只弹一次(二次修改之后的)，弹出框只弹一次，看到网上也 - phpStudy...

js 弹出框只弹一次(二次修改之后的) 弹出框只弹一次，看到网上也就写的很多，但真正能拿过来用的没有几个。以下是我修改之后的代码，供参考。这段代码是使用了cookie来控

客官°小女子只卖身不卖艺/ 2021年09月07日 08:06/ 0 赞/ 518 阅读

相关小程序用户进入首页，只弹框一次

场景用户第一次进入小程序，需要给用户一个新手引导，但是用户既不登录也不注册。只是进来逛了一圈就走了。下次再进来，此用户就不是新用户,就不在有新手引导

傷城~/ 2021年08月29日 13:52/ 0 赞/ 736 阅读