vue.js 找不到元素#app

Question

正在学习自定义插件，我正在尝试测试虚拟 DOM

import Vue from 'vue'
import MyPlugin from '@/plugins/MyPlugin'

Vue.use(MyPlugin)

describe('MyPlugin', () => {
  let vm

  beforeEach(() => {
    vm = new Vue({
      template: '<div id="app" class="container" v-demo:hello.a.b="msg"></div>',
      el: '#app',
      data: {
        msg: 'hello!'
      }
    }).$mount()
  })

  it('should run', () => {
    Vue.myMethod()
    console.log('INNER: ', vm.$el.innerHTML)
    expect(true).to.equal(true)
  })
})

但是我得到一个错误：

错误日志：'[Vue 警告]：找不到元素：#app'

尚未在模板中定义??

感谢反馈

Answer 1

el 属性用于指定当前在 DOM 中的元素来挂载 Vue 实例。

您不能在 Vue 实例的模板中指定该元素，因为它需要在 DOM 上的某处安装才能呈现。

您需要在 Vue 实例之外的 html 中添加一个 ID 为 #app 的元素，并从其模板中的 div 中删除 id="app"。

vue.js 找不到元素#app

vue.js Cannot find element #app

unit-testing

vue.js