微信小程序实现类似Vue中的computed、watch功能

构建npm

使用

在自定义组件中,以require的方式引入

1. computed 基本用法

   const computedBehavior = require('miniprogram-computed').behavior
   Component({
     behaviors: [computedBehavior],
     data: {
       a: 1,
       b: 1,
     },
     computed: {
       sum(data) {
         // 注意： computed 函数中不能访问 this ，只有 data 对象可供访问
         // 这个函数的返回值会被设置到 this.data.sum 字段中
         return data.a + data.b
       },
     },
     methods: {
       onTap() {
         this.setData({
           a: this.data.b,
           b: this.data.a + this.data.b,
         })
       },
     },
   })
   

2. watch 基本用法

   const computedBehavior = require('miniprogram-computed').behavior
   
   Component({
     behaviors: [computedBehavior],
     data: {
       a: 1,
       b: 1,
       sum: 2,
     },
     watch: {
       'a, b': function (a, b) {
         this.setData({
           sum: a + b,
         })
       },
     },
     methods: {
       onTap() {
         this.setData({
           a: this.data.b,
           b: this.data.a + this.data.b,
         })
       },
     },
   })