You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: source/api/instance-methods.md
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -110,4 +110,4 @@ Remove the vm's `$el` from the DOM.
110
110
111
111
### vm.$destroy()
112
112
113
-
Completely destroy a vm. Clean up its connections with other existing vms, unbind all its directives and remove its `$el` from the DOM.
113
+
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.
Copy file name to clipboardExpand all lines: source/api/instantiation-options.md
+8-6Lines changed: 8 additions & 6 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -166,34 +166,36 @@ A hash of HTML attributes to be set on `vm.$el`.
166
166
All lifecycle hooks have their `this` context bound to the ViewModel instance they belong to. For `'attached'`, `'detached'`, `'beforeDestroy'`, `'afterDestroy'`, the ViewModel instance will also emit events in the form of `'hook:eventName'`.
167
167
168
168
### created
169
-
169
+
170
170
-**Type:**`Function`
171
171
172
-
Called synchronously before the compilation starts. Can be used to attach additional data to be observed on the ViewModel.
172
+
Called synchronously before the compilation starts. At this stage, instance properties like `$el`, `$data` are available, but the DOM is in a pre-compile state, and the data has not been observed yet. Usually the created hook is used to attach additional initial states to the ViewModel. Any non-function properties attached to the ViewModel in the created hook will be copied to the data object and observed later.
173
+
174
+
If you use `$watch` in the created hook, the callback will also be called when the data is freshly observed. If you want to watch for changes only, attach the watcher in the ready hook.
173
175
174
176
### ready
175
177
176
178
-**Type:**`Function`
177
179
178
-
Called synchronously after the compilation has ended and the ViewModel instance is ready.
180
+
Called synchronously after the compilation has ended and the ViewModel instance is ready. At this stage, the DOM is fully compiled and the data has been observed, so changing existing data properties will trigger View updates. Additional properties attached to the ViewModel or the data object in the ready hook will **not** be observed.
179
181
180
182
### attached
181
183
182
184
-**Type:**`Function`
183
185
184
-
Called when `vm.$el` is attached to DOM by a VueJS directive. Direct manipulation of `vm.$el` will **not** trigger this hook.
186
+
Called when `vm.$el` is attached to DOM by a directive or a VM instance method such as `$appendTo()`. Direct manipulation of `vm.$el` will **not** trigger this hook.
185
187
186
188
### detached
187
189
188
190
-**Type:**`Function`
189
191
190
-
Called when `vm.$el` is removed from the DOM by a VueJS directive. Direct manipulation of `vm.$el` will **not** trigger this hook.
192
+
Called when `vm.$el` is removed from the DOM by a directive or a VM instance method. Direct manipulation of `vm.$el` will **not** trigger this hook.
191
193
192
194
### beforeDestroy
193
195
194
196
-**Type:**`Function`
195
197
196
-
Called before a ViewModel is destroyed.
198
+
Called before a ViewModel is destroyed. At this stage, the data is still observed, and all bindings and directive instances are still in effect. All child VMs of the current instance are also still active. This hook is mostly used internally but you can use it to clean up things you set up in the created or ready hook. There's no need to turn off `$on` and `$watch` listeners in here because all of them will be automatically turned off during `$destroy`.
Also available on [cdnjs](//cdnjs.cloudflare.com/ajax/libs/vue/{{vue_version}}/vue.min.js) (takes 4 hours to sync so the latest version might not be available yet).
20
+
Also available on [cdnjs](//cdnjs.cloudflare.com/ajax/libs/vue/{{vue_version}}/vue.min.js) (takes some time to sync so the latest version might not be available yet).
0 commit comments