From 5d30538611305f98743c5dbcd6849a64cfce4a21 Mon Sep 17 00:00:00 2001 From: BigBlueHat Date: Wed, 9 Jul 2014 12:39:33 -0400 Subject: [PATCH] added note about $data and mutation object Found these useful things in: https://github.com/yyx990803/vue/issues/328#issuecomment-46985518 and https://github.com/yyx990803/vue/issues/224#issuecomment-39796607 --- source/api/instance-methods.md | 20 +++++++++++++++++--- 1 file changed, 17 insertions(+), 3 deletions(-) diff --git a/source/api/instance-methods.md b/source/api/instance-methods.md index 98805424b4..5689c307c2 100644 --- a/source/api/instance-methods.md +++ b/source/api/instance-methods.md @@ -10,9 +10,23 @@ order: 4 ### vm.$watch( keypath, callback ) - **keypath** `String` -- **callback( newValue )** `Function` +- **callback( newValue, [mutation])** `Function` -Watch a keypath on the vm's data object for changes and call the callback with the new value. +Watch a keypath on the vm's data object (or the `$data` object itself) for changes and call the callback with the new value. + +A second `mutation` object is also available and is useful when watching arrarys: + +```javascript +this.$watch('list', function (value, mutation) { + if (mutation) { + mutation.method // e.g. 'push' + mutation.args // raw arguments to the mutation method + mutation.result // return value + mutation.inserted // new, inserted elements + mutation.removed // removed elements + } +}) +``` ### vm.$unwatch( keypath, [callback] ) @@ -110,4 +124,4 @@ Remove the vm's `$el` from the DOM. ### vm.$destroy() -Completely destroy a vm. Clean up its connections with other existing vms, unbind all its directives and remove its `$el` from the DOM. Also, all `$on` and `$watch` listeners will be automatically removed. \ No newline at end of file +Completely destroy a vm. Clean up its connections with other existing vms, unbind all its directives and remove its `$el` from the DOM. Also, all `$on` and `$watch` listeners will be automatically removed.