小程序组件概念

Component

组件是为了复用所存在的
组件化就如同乐高一般,某些设计可以使用一样的方块

Component({

  behaviors: [],

  // 属性定义(详情参见下文)
  properties: {
    myProperty: { // 属性名
      type: String,
      value: ''
    },
    myProperty2: String // 简化的定义方式
  },
  
  data: {}, // 私有数据,可用于模板渲染

  lifetimes: {
    // 生命周期函数,可以为函数,或一个在methods段中定义的方法名
    attached: function () { },
    moved: function () { },
    detached: function () { },
  },

  // 生命周期函数,可以为函数,或一个在methods段中定义的方法名
  attached: function () { }, // 此处attached的声明会被lifetimes字段中的声明覆盖
  ready: function() { },

  pageLifetimes: {
    // 组件所在页面的生命周期函数
    show: function () { },
    hide: function () { },
    resize: function () { },
  },

  methods: {
    onMyButtonTap: function(){
      this.setData({
        // 更新属性和数据的方法与更新页面数据的方法类似
      })
    },
    // 内部方法建议以下划线开头
    _myPrivateMethod: function(){
      // 这里将 data.A[0].B 设为 'myPrivateData'
      this.setData({
        'A[0].B': 'myPrivateData'
      })
    },
    _propertyChange: function(newVal, oldVal) {

    }
  }

})

需要在

组件的.json文件中标识

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

在页面上的.json文件引用

{
  "usingComponents": {
  "action-toast": "path....."
  }
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1.小程序起步 (1)点击https://mp.weixin.qq.com/wxopen/waregister?a...
    GXW_Lyon阅读 8,737评论 0 0
  • 因新工作主要负责微信小程序这一块,最近的重心就移到这一块,该博客是对微信小程序整体的整理归纳以及标明一些细节点,初...
    majun00阅读 12,131评论 0 9
  • 还记得 还记得 你那斑白的头发 是夜晚的霜染成的 你却毫不在意 只笑笑说 这就是生活 还记得 还记得 你那粗砺的双...
    理智疯子阅读 1,586评论 0 2
  • 酒中苑静悄悄的,很热闹。 你问,为什么?你来看花呀,看花就知道了。 要么你蹲在地上,看那些青草怎么冒出绿油油的叶子...
    行吟斯基阅读 4,979评论 5 4
  • 感觉自己命运够呛的了,人到中年恩爱丈夫去了,夫家没有半点人情味,一个人带着女儿艰难度日,生活非常不易。 ...
    霞飞梅林阅读 3,294评论 2 10