fixed bug #4466 #4300

examples/routers/select.vue

@@ -7,6 +7,8 @@
         <Select v-model="model2" multiple style="width:200px">
             <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
         </Select>
+
+        <Button type="primary" @click="changeData">changeData</Button>
     </div>
 </template>
 <script>
@@ -42,6 +44,11 @@
                 model1: '',
                 model2: []
             }
+        },
+        methods: {
+            changeData() {
+                this.model2.push('Canberra')
+            }
         }
     }
 </script>

src/components/select/select.vue

@@ -135,6 +135,15 @@
         return textContent || (typeof innerHTML === 'string' ? innerHTML : '');
     };
 
+    const checkValuesNotEqual = (value,publicValue,values) => {
+        const strValue = JSON.stringify(value);
+        const strPublic = JSON.stringify(publicValue);
+        const strValues = JSON.stringify(values.map( item => {
+            return item.value;
+        }));
+        return strValue !== strPublic || strValue !== strValues || strValues !== strPublic;
+    };
+
 
     const ANIMATION_TIMEOUT = 300;
 
@@ -653,12 +662,12 @@
         },
         watch: {
             value(value){
-                const {getInitialValue, getOptionData, publicValue} = this;
+                const {getInitialValue, getOptionData, publicValue, values} = this;
 
                 this.checkUpdateStatus();
 
                 if (value === '') this.values = [];
-                else if (JSON.stringify(value) !== JSON.stringify(publicValue)) {
+                else if (checkValuesNotEqual(value,publicValue,values)) {
                     this.$nextTick(() => this.values = getInitialValue().map(getOptionData).filter(Boolean));
                 }
             },