vue中一个元素一个元素创建并分析内容，递归算法

需求，项目中往往用到的V-FOR基本上是固定的循环次数，或者固定的数组，但如果动态添加会如何？

我的项目划分了N个页，就像WORD一样，当某页数据内容填充满了，我就得动态填加一页，并且分析新的页的有效区域是否能放r下我已有的数据内容，如果放下就不增加页了，如果放不下继续加页。

最开始，我以为这不就是把 v-for='item in arr' arr动态加子项的问题吗？不过，v-for一次会重新渲染里面的内容。也就会造成，每次增加一个新项，旧的内容会被刷新掉。于是，我的方法得改成，先动态创建页，并判断页内容是否能装载。

handleSubmmit () {
      // 创建
      let _this = this
      if (_this.questionBox.length === 0) {
        return false
      }

      // 存储在state中
      _this.$store.dispatch('setPagerMakerProp', {
        propName: 'question',
        val: _this.questionBox
      })
      
      // 判断页面方法
      _this.getPagerNums(_this.questionBox.length)

    },
  getPagerNums (questionLen) {
      let _this = this
      
      // 最多创建100页，也可以去除
      if (_this.temp === 100) { 
        return false 
      }
      
      //判断当前内容是否能装载下，我的是每个大块中子块，子Div通过有效高度算出，一个页最多能有几个
      if (questionLen <= _this.$store.state.pageInfo.questionSum) {
        return false
      }
      // 将页数放到vuex中存储起来，注意，此时需要等待视图更新后再操作
      _this.$store.state.pagerMaker.page = (_this.$store.state.pagerMaker.page + 1)
      
      //最大页数控制
      this.temp++
      
      //每次增加时，有一个nextTick，因为我的方法是一个页一个页增加，并没有确定总数
      _this.$nextTick(function () {
       // 每次增加页面，都要分析其相关内容
        _this.$com.handlePage.analyzeAllPage(_this, function () {
          if (questionLen <= _this.$store.state.pageInfo.questionSum) {
            _this.createQuestionBox()
          } else {
            return _this.getPagerNums(questionLen)
          }
        })
      })
    }

循环之前用过，但是得考虑VUE中的视图更新的问题，而且每加一页都得判断一下装载情况，for循环时，用的不是特别方便。而且每页的数据，也是用分割法，直接切割并扔进去。效率又提高了，只是，递归稍微有点浪费，但实际业务中，加个几十页最多了。

如果你加N多页，比如无限的情况下，建议考虑别的，毕竟JS递归有限制。