微信小程序学习笔记（2） --- 实时时间显示

微信小程序 实时时间 显示 ；

（1）在界面定义 文本控件Text ，用于将时间信息传入及显示；

 

 

 

index.wxml 文件代码：

 

      <text style="position: relative; left: -1rpx; top: 0rpx" class="time1">{{time}}</text> 

      注：定义控件名称 time1  ， 定义传入数据变量 time ；

 

(2) 常用函数 util.js 声明；

module.exports = {

  formatTime: formatTime

}

函数代码示例：

 

 

(3) 在 index.js 中添加逻辑函数；

       引用声明： var util = require('../../utils/util.js');   //--定时器控件--

       Data声明：

 data: {

    setInter:'', 

}

         逻辑函数：

 ////--定时器控件-- 

  //onShow: 小程序启动，或从后台进入前台显示时触发。

  onShow: function () {

    this.notification()  // 调用方法

  },

  notification: function () {

    var _this = this;

    var time = time;

    _this.data.setInter = setInterval(function () {

       _this.setData({

        time: util.formatTime(new Date())

        });    

    }, 1000); 

    // 一秒打印一次

    console.log(time);

  },

        注：部分示例转载于  (6条消息) 小程序定时器的开启和关闭_保持微笑ヽ继续我旳骄傲的博客-CSDN博客 ；