第一次进入小程序判断

第一次进入小程序判断

背景需求

1. 第一次进入小程序，展现气泡.
2. 五秒后消失，后面点击事件，进行气泡的展现消失
3. 如果五秒内，点击了事件，则气泡消失

实现

• 第一次进入气泡，五秒展现，

1. 设置一个变量，控制气泡的展现
2. 本次存储一个变量，判断是否是第一次展现
3. 第一次进入，本地存储的变量，肯定是false，如果本地变量是false ，那么改变气泡变量，为true
4. 并且加一个定时器，五秒后，改变本地变量为true，并且将气泡的值变为false

• 如果是点击

5. 先清空定时器，然后取反即可，并且将本地变量置位false

• 注意点
  这个五秒的时机，是请求完接口，有数据的时候，才展示气泡。所有这个方法放在接口之后

代码

• 首次进入的判断

bubbleFunc() {
    
		// 气泡
		let bubble = wx.getStorageSync('bubble');
		if (!bubble) {
    
			this.setData({
    
				isShowBubble: true,
			});
		}
		if (this.data.isShowBubble && this.data.numLikes) {
    
			this.$data.timerID = setTimeout(() => {
    
				this.setData({
    
					isShowBubble: false,
				});
				clearInterval(this.$data.timerID);
			}, 5000);
			wx.setStorageSync('bubble', true);
		}
	},

• 点击逻辑

bubbleHandler() {
    
		clearInterval(this.$data.timerID);
		const {
     isShowBubble } = this.data;
		this.setData({
    
			isShowBubble: !isShowBubble,
		});
		wx.setStorageSync('bubble', true);
	},