微信小程序入门学习之事件 事件对象 冒泡非冒泡事件(1)

这关于事件的学习,可以自己复制到微信开发者工具上自己运行试试。

首先这里有两个文件.js 和.wxml 文件

 

首先给出.js文件下代码

// pages/news/news.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    msg: "我是一个msg"
  },
  
  //这是一个生命周期函数  页面加载就会触发 
  onLoad: function (options) {
    console.log('生命周期函数  页面加载就会触发');
    //在生命周期函数里面调用方法
    this.run();  
    this.requestData('1234567');
  },
  
  run() {  /*自定义方法*/

    console.log('run自定义方法')
  }
  ,
  getMsg() {
    //获取data里面定义的数据
    console.log(this.data.msg);
  },
  setMsg() {
    //改变data里面msg的值
    this.setData({
      msg: '我是改变后的msg'
    })
  },

  //事件对象
  doEventFn(e) {
    console.log(e);
    //可以获取自定义属性的值
    console.log(e.currentTarget.dataset.aid)
    //当然既然知道自定义属性的值,可以根据这个属性做一些其他的操作了,暂时我还不会

  },

  //小程序里面执行方法传值
  requestData(aid) {
    console.log(aid);
  },

  //在view视图层执行方法传值

  requestViewData(event) {
    console.log(event.currentTarget.dataset);
  }


  , handleTap1() {
    console.log('handleTap1')
  }
  , handleTap2() {
    console.log('handleTap2')
  }
  , handleTap3() {
    console.log('handleTap3')
  }




})

然后是wxml 文件下代码


  {{msg}}























  outer view
  
    middle view
    
      inner view
    
  

运行案例

微信小程序入门学习之事件 事件对象 冒泡非冒泡事件(1)_第1张图片微信小程序入门学习之事件 事件对象 冒泡非冒泡事件(1)_第2张图片

你可能感兴趣的:(微信小程序学习)