Question

我正在尝试将两个Vue.js实例添加到同一个.js文件中，如下所示：

new Vue({
  el: '#step1',
  data: {
    value1: '',
  }
})


new Vue({
  el: '#step2',
  data: {
    value2: '',
  }
})

我在两个单独的网页中调用这两个实例。但是我收到了Vue警告，例如未找到[Vue warn]: Cannot find element: #step1或找不到[Vue warn]: Cannot find element: #step2。我做错了吗？或者有什么方法可以将两个实例连接在一起吗？

Answer 1

如果必须以这种方式设计代码，则可以在实例化Vue实例之前先测试该元素是否在该页面上：

if( document.getElementById("step1") ) {
    new Vue({
      el: '#step1',
      data: {
        value1: '',
      }
    })
}

if( document.getElementById("step2") ) {
    new Vue({
      el: '#step2',
      data: {
        value2: '',
      }
})

如何在同一.js文件上创建多个Vue实例？

1 个答案: