Skip to content

Commit 9e6bbef

Browse files
committed
custom directive deep option
1 parent e62df86 commit 9e6bbef

File tree

1 file changed

+18
-0
lines changed

1 file changed

+18
-0
lines changed

source/guide/custom-directive.md

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -185,6 +185,24 @@ Vue.directive('my-directive', {
185185

186186
Use this wisely though, because in general you want to avoid side-effects in your templates.
187187

188+
## Deep Observation
189+
190+
If your custom directive is expected to be used on an Object, and it needs to trigger `update` when a nested property inside the object changes, you need to pass in `deep: true` in your directive definition.
191+
192+
``` html
193+
<div v-my-directive="obj"></div>
194+
```
195+
196+
``` js
197+
Vue.directive('my-directive', {
198+
deep: true,
199+
update: function (obj) {
200+
// will be called when nested properties in `obj`
201+
// changes.
202+
}
203+
})
204+
```
205+
188206
## Directive Priority
189207

190208
You can optionally provide a priority number for your directive (defaults to 0). A directive with a higher priority will be processed earlier than other directives on the same element. Directives with the same priority will be processed in the order they appear in the element's attribute list, although that order is not guaranteed to be consistent in different browsers.

0 commit comments

Comments
 (0)