Improve getOptionLabel method

Author: Damian Dulisz

docs/partials/examples/_single-select-primitve.jade

@@ -12,7 +12,6 @@ p.typo__p Disabled all highlight label text.
       :show-labels="false"
       @update="updateValuePrimitive"
       placeholder="Select one"
-      label="name"
     )
     pre.language-json
       code.

src/multiselectMixin.js

@@ -5,7 +5,9 @@ module.exports = {
     return {
       search: '',
       isOpen: false,
-      value: this.selected ? deepClone(this.selected) : this.multiple ? [] : null
+      value: this.selected || this.selected === 0
+        ? deepClone(this.selected)
+        : this.multiple ? [] : null
     }
   },
   props: {
@@ -142,7 +144,6 @@ module.exports = {
     customLabel: {
       type: Function,
       default (option, label) {
-        if (option && option.isTag) return option.label
         return label ? option[label] : option
       }
     },
@@ -223,8 +224,7 @@ module.exports = {
         : this.options
     },
     currentOptionLabel () {
-      const label = this.getOptionLabel(this.value)
-      return label ? label.toString() : ''
+      return this.getOptionLabel(this.value)
     }
   },
   watch: {
@@ -238,11 +238,11 @@ module.exports = {
     },
     'search' () {
       /* istanbul ignore else */
-      if (this.search !== this.currentOptionLabel) {
-        this.$emit('search-change', this.search, this.id)
-      }
+      if (this.search === this.currentOptionLabel) return
+
+      this.$emit('search-change', this.search, this.id)
     },
-    'selected' (newVal, oldVal) {
+    'selected' () {
       this.value = deepClone(this.selected)
     }
   },
@@ -287,19 +287,16 @@ module.exports = {
       return !this.isSelected(option)
     },
     /**
-     * Returns the option[this.label]
-     * if option is Object. Otherwise check for option.label.
-     * If non is found, return entrie option.
-     *
+     * Returns empty string when options is null/undefined
+     * Returns tag query if option is tag.
+     * Returns the customLabel() results and casts it to string.
      * @param  {Object||String||Integer} Passed option
      * @returns {Object||String}
      */
     getOptionLabel (option) {
-      if (typeof option === 'object' && option !== null) {
-        return this.customLabel(option, this.label)
-      } else {
-        return option ? this.customLabel(option) : ''
-      }
+      if (!option && option !== 0) return ''
+      if (option.isTag) return option.label
+      return this.customLabel(option, this.label) + ''
     },
     /**
      * Add the given option to the list of selected options

test/unit/specs/Multiselect.spec.js

@@ -378,18 +378,18 @@ describe('Multiselect.vue', () => {
 
         it('should set search value to equal to passed value', (done) => {
           const vm = new Vue({
-            template: '<multiselect :selected="value" :options="source" label="id" key="id"></multiselect>',
+            template: '<multiselect :selected="value" :options="source"></multiselect>',
             components: { Multiselect },
             data: {
-              value: 2,
-              source: [1, 2, 3]
+              value: 0,
+              source: [0, 1, 2, 3]
             }
           }).$mount()
           const comp = vm.$children[0]
           comp.$nextTick(() => {
             comp.$nextTick(() => {
-              expect(comp.search).to.equal('2')
-              expect(comp.$els.search.value).to.equal('2')
+              expect(comp.search).to.equal('0')
+              expect(comp.$els.search.value).to.equal('0')
               done()
             })
           })
@@ -1088,17 +1088,17 @@ describe('Multiselect.vue', () => {
       expect(vm.$children[0].getOptionLabel(option)).to.equal('2')
     })
 
-    it('should return option’s label when custom label is set', () => {
+    it('should return tag’s query when option is a tag', () => {
       const vm = new Vue({
         template: '<multiselect :selected="value" :options="source" :multiple="true" label="id" key="id"></multiselect>',
         components: { Multiselect },
         data: {
           value: [],
-          source: [{ id: '1' }, { id: '2' }, { id: '3' }]
+          source: [{ isTag: true, label: 'isTag' }, { id: '2' }, { id: '3' }]
         }
       }).$mount()
-      const option = vm.$children[0].options[2]
-      expect(vm.$children[0].getOptionLabel(option)).to.equal('3')
+      const option = vm.$children[0].options[0]
+      expect(vm.$children[0].getOptionLabel(option)).to.equal('isTag')
     })
 
     it('should return customLabel’s interpolation if set', () => {