Vuetify组合框多选对象

Question

我的数据来源是：

var result = actions.xyz({ foo: "bar", commit: "everything" }, somePayload);

我需要保持这种格式。

在我的应用程序中，我需要添加键（例如添加标签）的可能性，我使用了组合框，并且可以显示数据。 但是，添加新元素时，它不会保留对象格式。

这是我的代码：

commit

仅文本

完整对象显示

如何在保持对象格式的同时添加新对象？

Answer 1

由于我们的项目是对象数组，因此您需要注意v-model=password.keys作为对象返回值。

    watch: {
        'password.keys' (val, prev) {
          if (val.length === prev.length) return

          this.password.keys = val.map(v => {
            if (typeof v === 'string') {
              v = {
                display: v,
                value: v
              }
              this.items.push(v)
            }

            return v
          })
        }
      }

Answer 2

<v-combobox :return-object="false">
    <template slot="selection" slot-scope="data">
      <v-chip
        :selected="data.selected"
        close
        @input="remove(data.item)"
      >
        <strong>{{ getItemText(data.item) }}</strong>&nbsp;
      </v-chip>
    </template>
</v-combobox>

methods: {
        getItemText(val) {
            const item = this.tags.find((i) => i.value === val);
            return item ? item.text : "";
        }
}