wumi_blog icon indicating copy to clipboard operation
wumi_blog copied to clipboard

vue $mount() $destroy() Object.assign()

Open 5Mi opened this issue 8 years ago • 0 comments

  • Object.assign()

    Object.assign({},{test:1},a)其中后面的参数会合并到第一个参数中去,合并过程中如果有相同属性,后面的会覆盖前面的属性值

//控制台中
var a
undefined
Object.assign({},a)
Object {}
var b = Object.assign(a,a)
VM15518:1 Uncaught TypeError: Cannot convert undefined or null to object
  • $mount()

If a Vue instance didn’t receive the el option at instantiation, it will be in “unmounted” state, without an associated DOM element or fragment. vm.$mount() can be used to manually start the mounting/compilation of an unmounted Vue instance.

If no argument is provided, the template will be created as an out-of-document fragment, and you will have to use other DOM instance methods to insert it into the document yourself. If replace option is set to false, then an empty <div> will be automatically created as the wrapper element.

Calling $mount() on an already mounted instance will have no effect. The method returns the instance itself so you can chain other instance methods after it.

如果一个vue实例没有设置el属性那么它将处于一个"unmounted"的状态,没有和dom元素联系在一起,vm.$mount会将实例装载在某个dom上,但直接vm.$mount()调用会将dom中的内容全部替换为vm的内容**//vm.$mount("body")则body中的内容会全被替换),所以一般$mount()方法不填参数//just manually start the mounting/compilation of an unmounted Vue instance**,之后通过dom方法将内容添加到dom中vm.$mount().$appendTo("#domId")

  • $destory()

先了解下$remove()

Remove the Vue instance’s DOM element or fragment from the DOM. This method will trigger transitions if present. The callback is fired after the transition has completed (or immediately if no transition has been triggered).

所以$remove只是将vm实例的内容从dom中移除,而$destory()

Completely destroy a vm. Clean up its connections with other existing vms, unbind all its directives, turn off all event listeners and, if the remove argument is true, remove its associated DOM element or fragment from the DOM.

Triggers the beforeDestroy and destroyed hooks.

$destory则是将vm实例完全销毁,$destory()调用之后vm被销毁了,但dom结构中已添加的渲染了的dom元素**//vm template中的内容**还存在,想要一并移除则添加remove参数为ture即调用$destroy(true)

5Mi avatar Jun 09 '16 06:06 5Mi