小程序基础学习（事件处理）

                                                                        

原理：组件内部设置点击事件，然后冒泡到页面捕获点击事件

在组件内部设置点击事件

处理点击事件，并告诉页面 

页面捕获点击事件 

页面处理点击事件

组件代码

{{title}}


{{conut}}

// components/my-info/my-info.js
Component({

  /**
   * 组件的属性列表
   */
  properties: {
    title:{
      type:String,
      value:"标题"
    },
    conut:{
      type:String,
      value:"内容没有写哦"
    },
   
  },

  /**
   * 组件的初始数据
   */
  data: {
    
  },

  /**
   * 组件的方法列表
   */
  methods: {
    onClick(){
      this.triggerEvent("onBtnClick","点击了详情")
    }

  }
})

/* components/my-info/my-info.wxss */
.texts{
  color: blue;
  font-size: large;

}
.number{
  color:chartreuse;
  font-size: larger;
}

{
  "component": true,
  "usingComponents": {}
}

 页面代码

// pages/five/five.js
Page({
  
onBtnClickOut(){
    console.log("你点了一下组件详情")
  }
})