当前位置: 首页 > 文档资料 > Vue.js 教程 >

7.12.1 vm.$mount

优质
小牛编辑
122浏览
2023-12-01
  • 参数:

    • {Element | string} [elementOrSelector]
    • {boolean} [hydrating]
  • 返回值:vm - 实例自身
  • 用法:

    如果 Vue 实例在实例化时没有收到 el 选项,则它处于“未挂载”状态,没有关联的 DOM 元素。可以使用 vm.$mount() 手动地挂载一个未挂载的实例。

    如果没有提供 elementOrSelector 参数,模板将被渲染为文档之外的的元素,并且你必须使用原生 DOM API 把它插入文档中。

    这个方法返回实例自身,因而可以链式调用其它实例方法。

  • 示例:
    var MyComponent = Vue.extend({
      template: '<div>Hello!</div>'
    })
    
    // 创建并挂载到 #app (会替换 #app)
    new MyComponent().$mount('#app')
    
    // 同上
    new MyComponent({ el: '#app' })
    
    // 或者,在文档之外渲染并且随后挂载
    var component = new MyComponent().$mount()
    document.getElementById('app').appendChild(component.$el)