From 07eb7b1b8f2c411134f46b66543db920a7243383 Mon Sep 17 00:00:00 2001 From: Simone Todaro Date: Wed, 17 Jan 2018 20:26:39 +0000 Subject: [PATCH] Allow user to specify the value property when options are objects --- src/components/Select.vue | 31 +++++++++++++++++++++++++++++-- 1 file changed, 29 insertions(+), 2 deletions(-) diff --git a/src/components/Select.vue b/src/components/Select.vue index 83c14a9..53c7cc3 100644 --- a/src/components/Select.vue +++ b/src/components/Select.vue @@ -499,6 +499,16 @@ default: 'label' }, + /** + * Tells vue-select what key to use when generating option + * values when each `option` is an object. + * @type {String} + */ + index: { + type: String, + default: null + }, + /** * Callback to generate the label text. If {option} * is an object, returns option[this.label] by default. @@ -521,6 +531,15 @@ return option[this.label] } } + if(this.index) { + let label = option + this.options.forEach((val) => { + if (val[this.index] == option) { + label = val[this.label] + } + }) + return label + } return option; } }, @@ -765,7 +784,15 @@ if (this.taggable && !this.optionExists(option)) { option = this.createOption(option) } - + if(this.index) { + if (!option.hasOwnProperty(this.index)) { + console.warn( + `[vue-select warn]: Index key "option.${this.index}" does not` + + ` exist in options object ${JSON.stringify(option)}.\n`; + ) + } + option = option[this.index] + } if (this.multiple && !this.mutableValue) { this.mutableValue = [option] } else if (this.multiple) { @@ -787,7 +814,7 @@ if (this.multiple) { let ref = -1 this.mutableValue.forEach((val) => { - if (val === option || typeof val === 'object' && val[this.label] === option[this.label]) { + if (val === option || (this.index && val === option[this.index]) || (typeof val === 'object' && val[this.label] === option[this.label])) { ref = val } })