微信小程序当中实现vue里面watch的监听操作

小程序自带的监听器 Observer，可以通过 this.observer() 方法来设置监听器，代码示例：

Page({
        data: {
          name: 'John',
          age: 25
        },
        onLoad: function () {
          // 设置监听器，监听 data 中 age 值的变化
          this.observe('age', function (newVal, oldVal) {
            console.log('年龄从', oldVal, '变为', newVal);
            // 在这里可以执行相应的操作
          });
        },
        // 其他页面相关代码...
      });

在微信小程序中，没有像 Vue 或 React 等前端框架一样直接支持 watch 的内置功能。然而，你可以手动实现类似的监听器功能，来监听数据对象的变化。下面是一个简单的实现方式：

function watch(obj: any, key: string, callback: Function) {
  let value = obj[key];
  Object.defineProperty(obj, key, {
    configurable: true,
    enumerable: true,
    get() {
      return value;
    },
    set(newValue) {
      const oldValue = value;
      value = newValue;
      callback.call(obj, newValue, oldValue);
    }
  });
}

export default watch;

然后在所需要的文件引入即可，部分代码示例：

 init(options: any) {
        this.setData({ naturalperson: JSON.parse(options.naturalperson) })
        watch(this.data, 'status', (newVal: number, oldVal: number) => {
	// 为什么会进入两次？
            if (newVal === oldVal) {
                console.log('watch status change >>>', newVal, oldVal);
                let sort = 0 // 分类
                let sortList = [
                    {
                        key: 0,
                        label: '正常'
                    },{
                        key: 1,
                        label: '紧急'
                    },
                ] // 分类列表
                if (1 === newVal) {
                    sort = 3;
                    sortList = [
                        {
                            key: 1,
                            label: '待审核'
                        },{
                            key: 2,
                            label: '待复审'
                        },{
                            key: 3,
                            label: '已审核'
                        },{
                            key: 4,
                            label: '异常'
                        },{
                            key: 9,
                            label: '申请中'
                        },
                    ]
                }
                this.setData({ sortList, sort })
            }
        });
    },