From 6ff31952a6eb27dfd2a824ab406263bac08d4ba7 Mon Sep 17 00:00:00 2001
From: 梁灏 <admin@aresn.com>
Date: Tue, 15 Nov 2016 11:24:28 +0800
Subject: [PATCH] optimize Input shaking when it init

---
 src/components/cascader/cascader.vue       | 71 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++----
 src/components/checkbox/checkbox-group.vue |  4 +++-
 src/components/input/input.vue             |  6 ++++--
 test/routers/cascader.vue                  |  5 ++++-
 4 files changed, 78 insertions(+), 8 deletions(-)

diff --git a/src/components/cascader/cascader.vue b/src/components/cascader/cascader.vue
index a0f797d..4ec4d83 100644
--- a/src/components/cascader/cascader.vue
+++ b/src/components/cascader/cascader.vue
@@ -1,18 +1,81 @@
 <template>
-    
+    <div :class="[prefixCls]">
+        <i-input
+            readonly
+            :disabled="disabled"
+            :value.sync="displayRender"
+            :size="size"
+            :placeholder="placeholder"></i-input>
+    </div>
 </template>
 <script>
+    import iInput from '../input/input.vue';
+    import Dropdown from '../select/dropdown.vue';
+    import clickoutside from '../../directives/clickoutside';
+    import { oneOf, MutationObserver } from '../../utils/assist';
+
+    const prefixCls = 'ivu-cascader';
+
     export default {
         props: {
-        
+            data: {
+                type: Array,
+                default () {
+                    return []
+                }
+            },
+            value: {
+                type: Array
+            },
+            disabled: {
+                type: Boolean,
+                default: false
+            },
+            clearable: {
+                type: Boolean,
+                default: false
+            },
+            placeholder: {
+                type: String,
+                default: '请选择'
+            },
+            size: {
+                validator (value) {
+                    return oneOf(value, ['small', 'large']);
+                }
+            },
+            trigger: {
+                validator (value) {
+                    return oneOf(value, ['click', 'hover']);
+                },
+                default: 'click'
+            },
+            changeOnSelect: {
+                type: Boolean,
+                default: false
+            },
+            renderFormat: {
+                type: Function,
+                default: (label, selectedData) => {
+                    label.join('/');
+                }
+            }
         },
         data () {
             return {
-            
+                prefixCls: prefixCls,
+                selected: []
             }
         },
         computed: {
-        
+            displayRender () {
+                let label = [];
+                for (let i = 0; i < this.selected.length; i++) {
+                    label.push(this.selected[i].label);
+                }
+
+                return this.renderFormat(label);
+            }
         },
         methods: {
         
diff --git a/src/components/checkbox/checkbox-group.vue b/src/components/checkbox/checkbox-group.vue
index bc9a27a..24b850b 100644
--- a/src/components/checkbox/checkbox-group.vue
+++ b/src/components/checkbox/checkbox-group.vue
@@ -10,7 +10,9 @@
         props: {
             model: {
                 type: Array,
-                default: []
+                default () {
+                    return []
+                }
             }
         },
         computed: {
diff --git a/src/components/input/input.vue b/src/components/input/input.vue
index f3f2f90..8d2fad6 100644
--- a/src/components/input/input.vue
+++ b/src/components/input/input.vue
@@ -1,7 +1,7 @@
 <template>
     <div :class="wrapClasses">
         <template v-if="type !== 'textarea'">
-            <div :class="[prefixCls + '-group-prepend']" v-if="prepend" v-el:prepend><slot name="prepend"></slot></div>
+            <div :class="[prefixCls + '-group-prepend']" v-if="prepend" v-show="slotReady" v-el:prepend><slot name="prepend"></slot></div>
             <i class="ivu-icon" :class="['ivu-icon-' + icon, prefixCls + '-icon']" v-if="icon" @click="handleIconClick"></i>
             <input
                 :type="type"
@@ -14,7 +14,7 @@
                 @keyup.enter="handleEnter"
                 @focus="handleFocus"
                 @blur="handleBlur">
-            <div :class="[prefixCls + '-group-append']" v-if="append" v-el:append><slot name="append"></slot></div>
+            <div :class="[prefixCls + '-group-append']" v-if="append" v-show="slotReady" v-el:append><slot name="append"></slot></div>
         </template>
         <textarea
             v-else
@@ -87,6 +87,7 @@
                 prefixCls: prefixCls,
                 prepend: true,
                 append: true,
+                slotReady: false,
                 textareaStyles: {}
             }        
         },
@@ -161,6 +162,7 @@
                 this.prepend = false;
                 this.append = false;
             }
+            this.slotReady = true;
             this.resizeTextarea();
         }
     }
diff --git a/test/routers/cascader.vue b/test/routers/cascader.vue
index a0f797d..7f43f60 100644
--- a/test/routers/cascader.vue
+++ b/test/routers/cascader.vue
@@ -1,7 +1,10 @@
 <template>
-    
+    <div style="margin: 150px;width:300px">
+        <Cascader></Cascader>
+    </div>
 </template>
 <script>
+    import { Cascader } from 'iview';
     export default {
         props: {
         
--
libgit2 0.21.4