behaviors(behaviors是小程序中,用于实现组件间代码共享的特性,类似于vue.js中的mixins)

301 阅读1分钟

behaviors

简介

  • behaviors是小程序中,用于实现组件间代码共享的特性,类似于vue.js中的mixins

工作方式

  • 每个behaviors可以包含一组属性、数据、生命周期函数和方式。组件引用它时,它的属性、数据和方法会被合并到组件中。
  • 每个组件可以引用多个behaviors,behaviors要可以引用其它behaviors。

创建

  • 调用Behavior(Object object)方法即可创建一个共享behavior实例对象,供所有的组件使用
// behaviors/myBehaviors.js
module.exports = Behavior({
  // 私有数据节点
  data: {
    num: 1
  },
  // 属性节点
  properties: {},
  // 事件处理函数和自定义方法节点
  methods: {
    add() {
      this.setData({
        num: this.data.num + 1
      })
    }
  }
  // 其他节点...
})

导入并使用

// 组件.js
// 1. 使用require()导入需要的自定义behavior模块
const myBehaviors = require('../../behaviors/myBehaviors')
Component({
  // 2. 将导入的behavior实例对象,挂载到behaviors数组节点中,即可生效
  behaviors: [myBehaviors]
  
})
<!-- 组件.wxml -->
<view>
  <view>子组件</view>
  <!-- 使用behaviors -->
  <view>behaviors里面的num:{{num}}</view>
  <button bindtap="add">+1</button>
</view>

behaviors中所有可用的节点

QQ图片20220816234637.jpg

同名字段的覆盖和组合规则

QQ图片20220816234642.jpg