js-小程序入门-存储弹框定时器(四)

一 存储 storage

每个微信小程序都可以有自己的本地缓存，可以通过
wx.setStorage/wx.setStorageSync、
wx.getStorage/wx.getStorageSync、
wx.clearStorage/wx.clearStorageSync，
wx.removeStorage/wx.removeStorageSync
对本地缓存进行读写和清理。

  onLoad: function(options) {
      //获取传入的值
      //console.log(options);
		this.setData({
			newsId: options.newsId,
		})

		var newsCollect = wx.getStorageSync('newsCollect');
		console.log("第一次进入时判断是否存在本地存储");
		console.log(newCollect);
		// 如果newsCollect存在,则代表以前收藏过或者是以前取消过收藏
		if (newsCollect) {
			var newCollect = newsCollect[options.newsId];
			console.log("如果newsCollect存在,则代表以前收藏过或者是以前取消过收藏");
			console.log(newCollect);
			//注意这里
			// if (!newCollect){
			// 	// 更新ui
			// 	this.setData({
			// 		collected: false
			// 	})
			// }else{
				// 更新ui
				this.setData({
					collected: newCollect
				})
		//	}
			
		} else {
			// 第一次进入，根本不存在数据
			var newsCollect = [];
			// 我把当前唯一id扔到newsCollect对象中，然后默认指定false
			newsCollect[options.newsId] = false;
			// 扔到本地存储中
			wx.setStorageSync('newsCollect', newsCollect);
			
		}

  },

	collectTap(event) {
		var newsCollect = wx.getStorageSync('newsCollect');
		console.log("获取所有值");
		console.log(newCollect);
		// 获取单个状态
		var newCollect = newsCollect[this.data.newsId];
		console.log("值:" + newCollect);
		// 点击时收藏则为不收藏，不收藏则为收藏
		newCollect = !newCollect;

		// 更新到本地存储中
		newsCollect[this.data.newsId] = newCollect;
		wx.setStorageSync('newsCollect', newsCollect);

		// 改变视图
		this.setData({
			collected: newsCollect[this.data.newsId]
		});
	},

二 弹框 Toast

1 wx.showToast() 消息提示框
可以自定义image
也可以通过wx.hideToast(Object object)隐藏消息提示框

	//icon: 'success', 'loading', 'none'
    wx.showToast({
			title:  "收藏成功！",
			icon: 'success',
			image: ‘../../images/star.png’,
			duration: 800,
			mask: true
		});

2 wx.showModal(）模态对话框

 wx.showModal({
      title: '提示',
      content: '这是一个模态弹窗',
      success(res) {
        if (res.confirm) {
          console.log('用户点击确定')
        } else if (res.cancel) {
          console.log('用户点击取消')
        }
      }
    })

3 wx.showActionSheet(）菜单

   wx.showActionSheet({
			itemList: ['A', 'B', 'C'],
			success(res) {
				console.log(res.tapIndex)
			},
			fail(res) {
				console.log(res.errMsg)
			}
		})

4 wx.showLoading(Object object) loading 提示框
需主动调用 wx.hideLoading 才能关闭提示框

 wx.showLoading({
      title: '加载中',
    })

    setTimeout(function() {
      wx.hideLoading()
    }, 2000)

三 定时器

<text>倒计时 ： {{countDownNum}}</text>
<button bindtap="start" type="primary">开始 倒计时</button>

<button style="margin-top:10px;" bindtap="clearInterval"  type="primary">取消 倒计时</button>

data: {
    timer: '', //定时器名字
    countDownNum: '10' //倒计时初始值
  },
  countDown: function() {
    let that = this;
    let countDownNum = that.data.countDownNum; //获取倒计时初始值
    //如果将定时器设置在外面，那么用户就看不到countDownNum的数值动态变化，所以要把定时器存进data里面
    that.setData({
      timer: setInterval(function() { //这里把setInterval赋值给变量名为timer的变量
        //每隔一秒countDownNum就减一，实现同步
        countDownNum--;
        //然后把countDownNum存进data，好让用户知道时间在倒计着
        that.setData({
          countDownNum: countDownNum
        })
        //在倒计时还未到0时，这中间可以做其他的事情，按项目需求来
        if (countDownNum == 0) {
          //这里特别要注意，计时器是始终一直在走的，如果你的时间为0，那么就要关掉定时器！不然相当耗性能
          //因为timer是存在data里面的，所以在关掉时，也要在data里取出后再关闭
          clearInterval(that.data.timer);
          //关闭定时器之后，可作其他处理
        }
        that.data.countDownNum = 11;
      }, 1000)
    });
  },
   start: function (e) {
		clearInterval(this.data.timer);
		this.data.countDownNum = 11;
		this.countDown();
	},
	clearInterval(e){
		clearInterval(this.data.timer);
		this.data.countDownNum = 11;
		this.setData({
			countDownNum: this.data.countDownNum
		})
	}

四 getUserInfo

五 camera

六 拨打电话

   /**
   * 拨打电话 - 可简单封装工具集
   */
	callPhone(phoneNumber) {
		wx.makePhoneCall({
			phoneNumber: phoneNumber,
			success: function () {
				console.log("拨打电话成功！")
			},
			fail: function () {
				console.log("拨打电话失败！")
			}
		})
	}