vue.js - vue 计算占位符更改多个选择框

Question

Vue 版本 2.6.10 我将尝试编写提供相关信息的代码，以防止它变得庞大

这是我与选择框有关的组件的一部分

<div class="input-field">
  <input
    :id="name"
    v-model="searchFilter"
    type="text"
    tabindex="-1"
    :class="{ searchbar: true, 'validation-error': validateError }"
    autocomplete="off"
    spellcheck="false"
    :disabled="disabled || loading"
    :readonly="single"
    :placeholder="placeholder"
    @click="openList"
  />
  <input-icon :loading="loading"></input-icon>
</div>

这是占位符部分的计算部分

computed: {
  placeholder() {
    if (this.single) {
      const selected = this.singleList.filter(item => item.selected === true).shift();
      return selected === undefined ? `Select ${_.startCase(this.name)}` : selected.name;
    }
  },
},

问题是，可以说我已经运行了 3 个该组件的实例？一旦我选择其中之一？其余的更改他们的 UI（又名占位符值）

这严格来说是一个 ui 问题，因为我可以说该值保持不变，但我似乎无法找到一种方法来访问该值以显示它。

我希望这是足够的信息继续下去

如果需要，将提供额外的代码。

提前致谢。

标签： vue.jsvuejs2