我的递归Vue组件出错，如何找到它？

Question

我正在构建问卷，问题的来源js文件大约有4500行。我在某些事情上遇到了类型错误，但我找不到导致它的行。这是错误。

我的组件看起来像

<template>
  <div class="form-panel">
    <h3 class="section__sub-header">{{ title }}</h3>
    <InputCheckbox @change="toggleChild" v-if="options" :inputParams="[safe, options, false]"></InputCheckbox>
    <InputPanel v-for="(node, i) in nodes" :key="i"
      v-show="checked.indexOf(options[i][0]) !== -1"
      @update="emitChecked"
      :title="node.title"
      :options="node.options"
      :nodes="node.nodes"
      :safe="options[i][0]"></InputPanel>
  </div>
</template>

源数据的结构如下：

productsServicesOptions: {
    title: 'Products and Services',
    options: [
      ['automotive', 'Automotive'],
      ['commercialIndustrialServices', 'Commercial & Industrial Services'],
      ['contractorsConstructions', 'Contractors & Constructions'],
      ['foodServices', 'Food Services'],
      ['healthBeautyWellBeing', 'Health, Beauty & Well-Being'],
      ['homeMaintenance', 'Home & Maintenance'],
      ['lawFinance', 'Law & Finance'],
      ['miscellaneous', 'Miscellaneous']
    ],
    nodes: [{
        title: 'Automotive',
        options: [
          ['glassAutomobile', 'Glass – Automobiles'],
          ['autoBodyRepairingPainting', 'Auto Body Repairing & Painting'],
          ['automobilePartsSupplies', 'Automobile Parts & Supplies'],
          ['automobileRepairingService', 'Automobile Repairing & Service'],
          ['autoWreckingRecycling', 'Auto Wrecking & Recycling'],
          ['homeMaintenance', 'Garages Auto Repairing'],
          ['tireDealersRetail', 'Tire Dealers – Retail'],
          ['towingAutomotive', 'Towing – Automotive'],
          ['transmissionsAutomotive', 'Transmissions – Automotive'],
          ['truckRepairingService', 'Truck Repairing & Service']
        ],
        nodes: [{ ...etc

我已经确定错误来自调用选项[0]，这让我觉得某些源数据没有正确地格式化为数组。我不得不写一个脚本将一个70页的单词doc转换成这个结构，所以我的数据很糟糕，这绝对是合理的。如何在源文件中找到该行的错误？

Answer 1

一些被淘汰的节点对象抛弃了数组长度。如果这样我可以一次检查一个问题，即使它很繁琐，也有助于将v-show交换到v-ind