如何使用Aurelia检测变量值变更并触发对应方法

完全可以实现，你正在使用的@observable装饰器本身就支持同类型值变更的检测，不存在只能检测类型变化的限制，只要按框架约定写好回调，就能在变量值（比如a从3修改为4）变更时自动执行magic()方法。

• 常规实现（默认约定写法）
  Aurelia 对@observable装饰的属性有默认回调约定：只要定义一个命名格式为[你的属性名]Changed的方法，属性值发生变化时框架会自动调用这个方法，回调里可以直接拿到变更后的新值、变更前的旧值。
  示例代码：

  import { observable } from 'aurelia-framework';
  
  export class DemoPage {
    // 定义被监听的属性a，初始值为3
    @observable a = 3;
  
    // a值变化时自动触发的回调
    aChanged(newVal, oldVal) {
      // 值变更后直接调用你需要执行的magic方法
      this.magic();
    }
  
    magic() {
      console.log('检测到a的值变更，执行对应逻辑');
    }
  
    // 测试触发：比如点击按钮调用这个方法把a改成4
    triggerChange() {
      this.a = 4; // 这时候会自动触发aChanged，执行magic()
    }
  }
  

• 自定义回调名写法
  如果你不想用属性名Changed的默认命名规则，也可以给@observable传入配置项，手动指定变更触发的回调方法名：

  import { observable } from 'aurelia-framework';
  
  export class DemoPage {
    @observable({ changeHandler: 'handleAChange' })
    a = 3;
  
    handleAChange(newVal, oldVal) {
      this.magic();
    }
  
    magic() {
      // 你的业务逻辑
    }
  }
  

补充说明：Aurelia 默认用严格相等（===）判断值是否变更，基础类型（数字、字符串、布尔值）的同类型值变化（比如数字3到4、字符串"test"到"test1"）都能被正常捕获。如果你要监听的是对象、数组内部的属性/元素变更，才需要额外用bindingEngine创建深度观察订阅，基础值的监听用上面的写法完全满足需求。

内容的提问来源于stack exchange，提问作者gast