Question

我从vue.js开始我的问题是关于设计模式。

我应该有多个这样的Vue实例：

        var example = new Vue({
          el: '#post-list',
          data: {
            posts: [
              { title: 'Foo' },
              { title: 'Bar' }
            ]
          }
        });

        var example2 = new Vue({
          el: '#post-list2',
          data: {
            posts: [
              { title: 'Foo' },
              { title: 'Bar' }
            ]
          }
        });

或者我应该尝试将我的Vue代码分组到一个像这样的大#app元素中：

        var app= new Vue({
          el: '#app',
          data: {
            posts1: [
              { title: 'Foo' },
              { title: 'Bar' }
            ],
            posts2: [
              { title: 'Foo' },
              { title: 'Bar' }
            ]
          }
        });

我正在寻找代码维护和性能。每种方法有哪些优点？是否有更好的模式可以遵循？

Answer 1

对于代码维护，Single File Component，其功能与第一个代码段相同，但建议更具工程性，vue-cli可能是您需要的工具。

对于代码性能，许多实例需要多个实例。但是一个缺陷不能掩盖玉石的辉煌。不可忽视的性能损失带来的可维护性是可以接受的。

我的Vue.js代码应该有多个小实例还是一个大实例？

1 个答案: