Question

我有三个下拉菜单，您可以在我的下面的代码中看到。当我选择其中一个值时，输出数组会显示从数组中提取的与下拉列表关联的标记。

这很有效，但是当我选择下一个下拉列表时，它会删除数组中的所有当前值，并替换为第二个下拉列表值。我希望保留与每个下拉列表相关联的值，并在每个下拉列表更改阵列更新时进行演示。

真的希望我有意义，但基本上我想根据所选的三个下拉列值构建一个数组，并在这些下拉列表更改时更新此数组。

<div id="app">
  <div>
    <div class="profiler">
      <div class="in">
        <div class="profiler__form">
          <div class="profiler__form--row">
            <span>I'm visiting for a </span>
            <dropdown @menu-tags="menuTags" @prev-array="previousArray" v-bind:dropdown="visiting">Special Occasion</dropdown>
          </div>
          <div class="profiler__form--row">
            <span>I'm interested in</span>
            <!-- Pass down to child a custom event listener called is-menu-visible and assign 
               to a function called isMenuVisible (See dropdown.vue) -->
            <dropdown @menu-tags="menuTags" @prev-array="previousArray" v-bind:dropdown="interestedOne">The Spa</dropdown>
            <span>and</span>
            <dropdown @menu-tags="menuTags" @prev-array="previousArray" v-bind:dropdown="interestedTwo">Exploring</dropdown><br><br>{{watchCurrent}} <span>-- BUILD THIS BASED ON ALL DROPDOWNS
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

任何帮助都很棒：）

根据选定的下拉列表构建阵列，并使用计算函数动态更新

0 个答案: