属性监听

通过drunk.Component#$watch(expression, callback, deepWatch?, immediateTriggerWatcher?)对属性的监控，可以方便的做一些关联性的操作。

监听简单表达式

<input type="number" drunk-model="amount" />

var viewModel = new drunk.Component();
viewModel.$watch('amount', function (newValue, oldValue) {
  // 对值作校验,使用户输入的值不大于100
  if (newValue && newValue > 100) {
    this.amount = 100;
  }
});

监听复杂的表达式

viewModel.$watch('a.b.c', function (newValue) {
  console.log('a.b.c has been changed', newValue);
});
viewModel.a = { b: { c: 123 } }; // a.b.c has been changed 123

深度监听数组或对象

viewModel.$watch('list', function () {
  console.log('changed');}, true);
viewModel.list = []; // changed
viewModel.list.push({name: '123'}); // changed
viewModel.list[0].name = '234'; // changed

viewModel.$watch('obj', function () {
  console.log('changed');
});
viewModel.obj = {}; // changed
drunk.observable.$set(viewModel.obj, 'a', {name: 'a'}); // changed
viewModel.obj.a.name = 'not a'; // changed