diff --git a/components/action-sheet/README.md b/components/action-sheet/README.md
index d2cfaa8d0..69974a2f6 100644
--- a/components/action-sheet/README.md
+++ b/components/action-sheet/README.md
@@ -27,6 +27,7 @@ Vue.component(ActionSheet.name, ActionSheet)
 |default-index|默认选中项| Boolean| `0`|
 |invalid-index|禁用选择项索引 |Number|`-1`|
 |cancel-text|取消按钮文案 |String |-|
+|max-height|面板最高高度, 超出后可滚动|Number|400|单位`px`|
 
 #### ActionSheet Events
 
diff --git a/components/action-sheet/index.vue b/components/action-sheet/index.vue
index 5df6ad2c8..e62db42cf 100644
--- a/components/action-sheet/index.vue
+++ b/components/action-sheet/index.vue
@@ -4,10 +4,11 @@
       v-model="isActionSheetShow"
       position="bottom"
       prevent-scroll
+      :prevent-scroll-exclude="scroller"
       @show="$_onShow"
       @hide="$_onHide"
     >
-      <div class="md-action-sheet-content">
+      <div class="md-action-sheet-content" :style="{maxHeight: `${maxHeight}px`}">
         <header v-if="title">{{ title }}</header>
         <ul>
           <template v-for="(item, index) in options">
@@ -66,12 +67,17 @@ export default {
       type: String,
       default: '取消',
     },
+    maxHeight: {
+      type: Number,
+      default: 400,
+    },
   },
 
   data() {
     return {
       isActionSheetShow: this.value,
       clickIndex: -1,
+      scroller: '',
     }
   },
 
@@ -86,8 +92,17 @@ export default {
   },
 
   methods: {
+    $_setScroller() {
+      const boxer = this.$el ? this.$el.querySelector('.md-action-sheet-content') : null
+      if (boxer && boxer.clientHeight >= this.maxHeight) {
+        this.scroller = '.md-action-sheet-content'
+      } else {
+        this.scroller = ''
+      }
+    },
     // MARK: events handler, 如 $_onButtonClick
     $_onShow() {
+      this.$_setScroller()
       this.$emit('show')
     },
     $_onHide() {
@@ -115,12 +130,12 @@ export default {
   color color-text-base
   -webkit-font-smoothing antialiased
   .md-action-sheet-content
-    overflow hidden
     position relative
     width 100%
     font-size action-sheet-font-size
     background color-bg-base
     text-align center
+    overflow auto
     header
       vertical-height(action-sheet-height)
       padding 0 30px
diff --git a/components/cashier/index.vue b/components/cashier/index.vue
index 69d03b60d..3df059130 100644
--- a/components/cashier/index.vue
+++ b/components/cashier/index.vue
@@ -40,8 +40,18 @@
                   <md-icon :name="item.icon"></md-icon>
                 </i>
                 <span class="item-label" v-html="item.text || item.label"></span>
-                <md-icon name="circle-right" class="item-check" v-if="index === activeChannelIndex"></md-icon>
-                <md-icon name="circle" class="item-check" v-else></md-icon>
+                <template v-if="!isSingle">
+                  <md-icon
+                    v-if="index === activeChannelIndex"
+                    name="circle-right"
+                    class="item-check"
+                  ></md-icon>
+                  <md-icon
+                    v-else
+                    name="circle"
+                    class="item-check"
+                  ></md-icon>
+                </template>
               </li>
             </ul>
             <ul class="choose-channel-list" v-else-if="channels[defaultIndex]">
@@ -50,11 +60,15 @@
                   <md-icon :name="channels[defaultIndex].icon"></md-icon>
                 </i>
                 <span class="item-label" v-html="channels[defaultIndex].text || channels[defaultIndex].label"></span>
-                <md-icon name="circle-right" class="item-check"></md-icon>
+                <md-icon
+                  v-if="!isSingle"
+                  name="circle-right"
+                  class="item-check"
+                ></md-icon>
               </li>
             </ul>
             <div
-              v-if="channels.length"
+              v-if="!isSingle"
               class="choose-channel-more"
               :class="{disabled: isChannelActive}"
               @click="$_onChannelMore"
@@ -210,6 +224,12 @@ export default {
     }
   },
 
+  computed: {
+    isSingle() {
+      return !(this.channels.length > 1)
+    },
+  },
+
   watch: {
     value(val) {
       this.isCashierShow = val
@@ -224,6 +244,11 @@ export default {
 
   created() {
     this.$_initialCashier()
+
+    if (this.channels.length < 3) {
+      this.isChannelShow = true
+      this.isChannelActive = true
+    }
   },
 
   methods: {
diff --git a/components/cashier/rolling.vue b/components/cashier/rolling.vue
index a3c7f6fe3..7206385d8 100644
--- a/components/cashier/rolling.vue
+++ b/components/cashier/rolling.vue
@@ -79,7 +79,7 @@
     doSuccess() {
       const st = this.startTmp
       const et = Date.now()
-      const delay = Math.ceil((et - st) / 2000) * 2000 - (et - st)
+      const delay = Math.ceil((et - st) / 1500) * 1500 - (et - st)
       setTimeout(() => {
         this.successFlag = true
       }, delay)
diff --git a/components/cashier/test/index.spec.js b/components/cashier/test/index.spec.js
index 77a17d323..42a0b04d3 100644
--- a/components/cashier/test/index.spec.js
+++ b/components/cashier/test/index.spec.js
@@ -45,10 +45,10 @@ describe('Cashier', () => {
     wrapper.vm.channels = channels
     wrapper.vm.defaultIndex = 1
     wrapper.vm.value = true
-    wrapper.vm.$nextTick(() => {
+    setTimeout(() => {
       expect(
         wrapper
-          .find('.choose-channel-item')[0]
+          .find('.choose-channel-item.default')[0]
           .text()
           .trim(),
       ).to.equal(channels[1].text)
@@ -71,7 +71,7 @@ describe('Cashier', () => {
         wrapper.vm.value = false
         done()
       })
-    })
+    }, 500)
   })
 
   it('cashier captcha', done => {
diff --git a/components/date-picker/README.md b/components/date-picker/README.md
index 9cc00a597..c113f27d6 100644
--- a/components/date-picker/README.md
+++ b/components/date-picker/README.md
@@ -36,6 +36,7 @@ Vue.component(DatePicker.name, DatePicker)
 |title|选择器标题|String|-|-| 
 |ok-text|选择器确认文案|String|`确认`|-| 
 |cancel-text|选择器取消文案|String|`取消`|-| 
+|mask-closable|点击蒙层是否可关闭弹出层|Boolean|`true`|-|
 
 #### DatePicker Methods
 
diff --git a/components/date-picker/index.vue b/components/date-picker/index.vue
index 5bf0be111..40cf4846d 100644
--- a/components/date-picker/index.vue
+++ b/components/date-picker/index.vue
@@ -10,9 +10,11 @@
       :ok-text="okText"
       :cancel-text="cancelText"
       :is-view="isView"
+      :mask-closable="maskClosable"
       @initialed="$emit('initialed')"
       @change="$_onPickerChange"
       @confirm="$_onPickerConfirm"
+      @cancel="$_onPickerCancel"
       @show="$_onPickerShow"
       @hide="$_onPickerHide"
     ></md-picker>
@@ -133,6 +135,10 @@ export default {
     isView: {
       type: Boolean,
       default: false
+    },
+    maskClosable: {
+      type: Boolean,
+      default: true,
     }
   },
 
@@ -141,6 +147,7 @@ export default {
       isPickerShow: false,
       currentDateIns: new Date(),
       columnData: [],
+      oldColumnData: null,
       columnDataDefault: [],
       columnDataGenerator: [],
       disabledCascadeComlumnIndex: [] // columns do not need cascading 
@@ -235,7 +242,7 @@ export default {
       isSetColumn && this.picker.refresh(null, columnIndex)
     },
     $_initColumnDataGenerator () { 
-      const defaultDate = this.defaultDate     
+      const defaultDate = this.$_getDefaultDate()     
       switch (this.type) {
         case 'date':
           this.$_initColumnDataGeneratorForDate(defaultDate)
@@ -319,6 +326,25 @@ export default {
         this.columnDataDefault.push(hourInfo.ap)
       }
     },
+    $_getDefaultDate () {
+      const defaultDate = this.defaultDate
+      const minDate = this.minDate
+      const maxDate = this.maxDate
+
+      if (!defaultDate) {
+        return defaultDate
+      }
+
+      if (minDate && defaultDate.getTime() < minDate.getTime()) {
+        return minDate
+      }
+
+      if (maxDate && defaultDate.getTime() > maxDate.getTime()) {
+        return maxDate
+      }
+
+      return defaultDate
+    },
     $_generateYearData () {
       const start = this.minDate ? this.minDate.getFullYear() : this.currentYear - 20
       const end = this.maxDate ? this.maxDate.getFullYear() : this.currentYear + 20
@@ -469,6 +495,7 @@ export default {
 
     // MARK: events handler
     $_onPickerShow () {
+      this.oldColumnData = [...this.columnData]
       this.$emit('show')
     },
     $_onPickerHide () {
@@ -489,6 +516,10 @@ export default {
     $_onPickerConfirm (columnsValue) {
       this.$emit('confirm', columnsValue)
     },
+    $_onPickerCancel () {
+      this.$emit('cancel')
+      this.columnData = [...this.oldColumnData]
+    },
 
     getFormatDate (format = 'yyyy-MM-dd hh:mm') {
       const columnValues = this.picker.getColumnValues()
diff --git a/components/picker/README.md b/components/picker/README.md
index e7243eff3..8463b4cd5 100644
--- a/components/picker/README.md
+++ b/components/picker/README.md
@@ -31,6 +31,7 @@ Vue.component(Picker.name, Picker)
 |title|选择器标题|String|-|-|
 |ok-text|选择器确认文案|String|`确认`|-|
 |cancel-text|选择器取消文案|String|`取消`|-|
+|mask-closable|点击蒙层是否可关闭弹出层|Boolean|`true`|-|
 
 #### Picker Methods
 
diff --git a/components/picker/demo/cases/demo2.vue b/components/picker/demo/cases/demo2.vue
index 8d33a38b2..68324fed3 100644
--- a/components/picker/demo/cases/demo2.vue
+++ b/components/picker/demo/cases/demo2.vue
@@ -2,26 +2,42 @@
   <div class="md-example-child md-example-child-picker md-example-child-picker-2">
     <md-field>
       <md-field-item
-        name="name"
         title="起保年份"
         arrow="arrow-right"
         align="right"
-        :value="pickerValue"
-        @click.native="isPickerShow = true">
+        :value="pickerValue0"
+        @click.native="isPickerShow0 = true">
+      </md-field-item>
+      <md-field-item
+        title="省市区/县"
+        arrow="arrow-right"
+        align="right"
+        :value="pickerValue1"
+        @click.native="isPickerShow1 = true">
       </md-field-item>
     </md-field>
     <md-picker
-      ref="picker"
-      v-model="isPickerShow"
-      :data="pickerData"
-      @confirm="onPickerConfirm"
+      ref="picker0"
+      v-model="isPickerShow0"
+      :data="pickerData0"
+      @confirm="onPickerConfirm(0)"
       title="选择年份"
     ></md-picker>
+    <md-picker
+      ref="picker1"
+      v-model="isPickerShow1"
+      :data="pickerData1"
+      :cols="3"
+      is-cascade
+      title="选择省市区/县"
+      @confirm="onPickerConfirm(1)"
+    ></md-picker>
   </div>
 </template>
 
 <script>
import {Picker, Field, FieldItem} from 'mand-mobile'
 import simple from 'mand-mobile/components/picker/demo/data/simple'
+import district from 'mand-mobile/components/picker/demo/data/district'
 
 export default {
   name: 'picker-demo',
@@ -36,20 +52,23 @@ export default {
   },
   data() {
     return {
-      isPickerShow: false,
-      pickerData: simple,
-      pickerValue: '',
+      isPickerShow0: false,
+      isPickerShow1: false,
+      pickerData0: simple,
+      pickerData1: district,
+      pickerValue0: '',
+      pickerValue1: '',
     }
   },
   methods: {
-    onPickerConfirm() {
-      const values = this.$refs['picker'].getColumnValues()
+    onPickerConfirm(index) {
+      const values = this.$refs[`picker${index}`].getColumnValues()
 
       let res = ''
       values.forEach(value => {
-        value && (res += `${value.text} `)
+        value && (res += `${value.text || value.label} `)
       })
-      this.pickerValue = res
+      this[`pickerValue${index}`] = res
     },
   },
 }
diff --git a/components/picker/index.vue b/components/picker/index.vue
index 40166ac0b..36b6ed9d9 100644
--- a/components/picker/index.vue
+++ b/components/picker/index.vue
@@ -19,9 +19,11 @@
       <md-popup
         v-model="isPickerShow"
         position="bottom"
+        :mask-closable="maskClosable"
         @beforeShow="$_onPickerBeforeShow"
         @show="$_onPickerShow"
         @hide="$_onPickerHide"
+        @maskClick="$_onPickerCancel"
         prevent-scroll
       >
         <md-popup-title-bar
@@ -34,11 +36,11 @@
         <md-picker-column
           ref="pickerColumn"
           :data="data"
-          :default-value="defaultValue"
-          :default-index="defaultIndex"
+          :default-value="$_getDefaultValue()"
+          :default-index="$_getDefaultIndex()"
           :invalid-index="invalidIndex"
           :cols="cols"
-          @initialed="$emit('initialed')"
+          @initialed="$_onPickerInitialed"
           @change="$_onPickerChange"
         ></md-picker-column>
       </md-popup>
@@ -118,11 +120,17 @@ export default {
       type: String,
       default: '取消',
     },
+    maskClosable: {
+      type: Boolean,
+      default: true,
+    },
   },
 
   data() {
     return {
       isPickerShow: false,
+      isPickerFirstPopup: true,
+      oldActivedIndexs: null,
     }
   },
 
@@ -147,14 +155,18 @@ export default {
     },
     data: {
       handler(val, oldVal) {
-        this.$_resetPickerColumn(val, oldVal)
+        if (!compareObjects(val, oldVal)) {
+          this.$_initPickerColumn()
+        }
       },
       deep: true,
       immediate: true,
     },
     defaultIndex: {
       handler(val, oldVal) {
-        this.$_resetPickerColumn(val, oldVal)
+        if (!compareObjects(val, oldVal)) {
+          this.$_initPickerColumn()
+        }
       },
       deep: true,
     },
@@ -178,6 +190,15 @@ export default {
       }
 
       this.column.inheritPickerApi(this, ['refresh'])
+
+      if (this.isPickerFirstPopup) {
+        this.isPickerFirstPopup = false
+      } else {
+        // mark initial activedIndexs as snapshoot
+        setTimeout(() => {
+          this.oldActivedIndexs = [...this.column.activedIndexs]
+        }, 100)
+      }
     },
     $_initPickerColumn() {
       /* istanbul ignore if */
@@ -185,26 +206,25 @@ export default {
         return
       }
 
-      const defaultIndexOfFirstColumn = this.defaultIndex[0] || 0
+      const defaultIndex = this.$_getDefaultIndex()
+      const defaultIndexOfFirstColumn = defaultIndex[0] || 0
       this.$nextTick(() => {
         cascadePicker(this.column, {
           currentLevel: 0,
           maxLevel: this.cols,
           values: this.data[0] ? this.data[0][defaultIndexOfFirstColumn] || [] : [],
-          defaultIndex: this.defaultIndex,
+          defaultIndex,
         })
-        // this.$nextTick(() => {
-        //   this.column.refresh(() => {
-        //     // column should be refreshed when first time popup show
-        //     this.column.isScrollInitialed = false
-        //   })
-        // })
       })
     },
-    $_resetPickerColumn(val, oldVal) {
-      if (!compareObjects(val, oldVal)) {
-        this.$_initPickerColumn()
-      }
+    $_resetPickerColumn() {
+      this.$_initPickerColumn()
+    },
+    $_getDefaultIndex() {
+      return this.oldActivedIndexs || this.defaultIndex
+    },
+    $_getDefaultValue() {
+      return this.oldActivedIndexs ? [] : this.defaultValue
     },
     $_onPickerConfirm() {
       const column = this.column
@@ -228,9 +248,18 @@ export default {
         this.$emit('confirm', columnValues)
       }
     },
+    $_onPickerInitialed() {
+      this.$emit('initialed')
+    },
     $_onPickerCancel() {
       this.isPickerShow = false
       this.$emit('cancel')
+
+      // reset picker by snapshot
+      this.$nextTick(() => {
+        this.$_resetPickerColumn()
+        this.refresh()
+      })
     },
     $_onPickerChange(columnIndex, itemIndex, values) {
       /* istanbul ignore next */
@@ -268,7 +297,6 @@ export default {
 
     refresh() {
       this.column.isScrollInitialed = false
-
       /** 
        * Manual call 'column.refresh' only when picker is in-view or popup is show,
        * otherwise 'column.refresh' will be called at popup's 'onBerforeShow' automatically
diff --git a/components/popup/index.vue b/components/popup/index.vue
index b92781e36..3da9deed9 100644
--- a/components/popup/index.vue
+++ b/components/popup/index.vue
@@ -206,7 +206,10 @@
       this.isAnimation = false
     },
     $_onPopupMaskClick() {
-      this.maskClosable && this.$_hidePopupBox()
+      if (this.maskClosable) {
+        this.$_hidePopupBox()
+        this.$emit('maskClick')
+      }
     },
   },
 }
diff --git a/components/selector/README.md b/components/selector/README.md
index b7e4d688f..ecc41c711 100644
--- a/components/selector/README.md
+++ b/components/selector/README.md
@@ -29,8 +29,10 @@ Vue.component(Selector.name, Selector)
 |title|选择器标题|String|-|-|
 |ok-text|选择器确认文案|String|-|若为空则为`确认模式`，即点击选项直接选择|
 |cancel-text|选择器取消文案|String|`取消`|-|
+|mask-closable|点击蒙层是否可关闭弹出层|Boolean|`true`|-|
 |is-check|是否有`check`图标|Boolean|`false`|仅`确认模式`|
 |option-render|返回各选项渲染内容|Function({value, text ,...}):String|-|`vue 2.1.0+`可使用`slot-scope`，参考`Radio`|
+|max-height|选择器内容区域最高高度, 超出后可滚动|Number|400|单位`px`|
 
 
 #### Selector Events
diff --git a/components/selector/index.vue b/components/selector/index.vue
index f49e45951..e2cba9788 100644
--- a/components/selector/index.vue
+++ b/components/selector/index.vue
@@ -9,10 +9,12 @@
     <md-popup
       v-model="isSelectorShow"
       position="bottom"
-      :mask-closable="false"
-      :prevent-scroll="true"
-      @show="$emit('show')"
-      @hide="$emit('hide')"
+      :mask-closable="maskClosable"
+      prevent-scroll
+      :prevent-scroll-exclude="scroller"
+      @show="$_onSelectorShow"
+      @hide="$_onSelectorHide"
+      @maskClick="$_onSelectorCancel"
     >
       <md-popup-title-bar
         :title="title"
@@ -21,7 +23,7 @@
         @confirm="$_onSelectorConfirm"
         @cancel="$_onSelectorCancel"
       ></md-popup-title-bar>
-      <div class="md-selector-container">
+      <div class="md-selector-container" :style="{maxHeight: `${maxHeight}px`}">
         <div class="md-selector-list">
           <md-radio
             ref="radio"
@@ -93,6 +95,10 @@ export default {
       type: String,
       default: '',
     },
+    maskClosable: {
+      type: Boolean,
+      default: true,
+    },
     isCheck: {
       type: Boolean,
       default: false,
@@ -101,6 +107,10 @@ export default {
       type: Function,
       default: noop,
     },
+    maxHeight: {
+      type: Number,
+      default: 400,
+    },
   },
 
   data() {
@@ -109,6 +119,7 @@ export default {
       radioKey: Date.now(),
       activeIndex: -1,
       tmpActiveIndex: -1,
+      scroller: '',
     }
   },
 
@@ -154,6 +165,14 @@ export default {
       const invalidIndex = this.invalidIndex
       return Array.isArray(invalidIndex) ? !!~invalidIndex.indexOf(index) : index === invalidIndex
     },
+    $_setScroller() {
+      const boxer = this.$el ? this.$el.querySelector('.md-selector-list') : null
+      if (boxer && boxer.clientHeight >= this.maxHeight) {
+        this.scroller = '.md-selector-container'
+      } else {
+        this.scroller = ''
+      }
+    },
 
     // MARK: events handler
     $_onSelectorConfirm() {
@@ -185,6 +204,15 @@ export default {
 
       this.$emit('choose', item)
     },
+    $_onSelectorShow() {
+      /* istanbul ignore next  */
+      this.$_setScroller()
+      this.$emit('show')
+    },
+    $_onSelectorHide() {
+      /* istanbul ignore next  */
+      this.$emit('hide')
+    },
   },
 }
 
</script>
@@ -197,6 +225,7 @@ export default {
       background-color color-bg-base
     .md-selector-container
       background color-bg-base
+      overflow auto
       .md-selector-item
         position relative
         height selector-height
diff --git a/components/tab-picker/README.md b/components/tab-picker/README.md
index 0441ff490..75db73bcd 100644
--- a/components/tab-picker/README.md
+++ b/components/tab-picker/README.md
@@ -52,6 +52,7 @@ tab切换的title支持自定义渲染（通过slot-scope）
 |title|弹窗标题|Boolean|-|-|
 |ok-text|确认按钮文案|String|`确认`|-|
 |cancel-text|取消按钮文案|String|`取消`|-|
+|mask-closable|点击蒙层是否可关闭弹出层|Boolean|`true`|-|
 
 
 #### TabPicker Methods
diff --git a/components/tab-picker/demo/index.vue b/components/tab-picker/demo/index.vue
index caa1b6e9c..eee2844db 100644
--- a/components/tab-picker/demo/index.vue
+++ b/components/tab-picker/demo/index.vue
@@ -49,6 +49,7 @@
           cancel-text="取消"
           data-struct= "cascade"
           :option-render="[()=>{}, ()=>{}, $_optionRender]"
+          :default-index="[0,0,0]"
           @confirm="$_confirm"
           @cancel="$_cancel"
           @change="$_change"
diff --git a/components/tab-picker/index.vue b/components/tab-picker/index.vue
index 8bfa7d534..ce79015d7 100644
--- a/components/tab-picker/index.vue
+++ b/components/tab-picker/index.vue
@@ -3,9 +3,10 @@
     <md-popup
       v-model="isTabPickerShow"
       position="bottom"
-      :mask-closable="false"
+      :mask-closable="maskClosable"
       @show="$_onShow"
       @hide="$_onHide"
+      @maskClick="$_onMaskClose"
     >
       <md-popup-title-bar
         :title="title"
@@ -21,6 +22,7 @@
           :default-index="defaultTabIndex"
           :force-use-array="hasTitleSlotScope"
           @indexChanged="$_onIndexChange"
+          :key="refreshTabPicker"
         >
           <template
             slot="title"
@@ -89,6 +91,10 @@ export default {
       type: String,
       default: '取消',
     },
+    maskClosable: {
+      type: Boolean,
+      default: true,
+    },
     data: {
       type: Array,
       default() {
@@ -138,6 +144,9 @@ export default {
       isLoading: true,
       isDataError: false,
       currentColumnLock: false,
+      lastSelectIndex: null,
+      refreshTabPicker: 0,
+      walkTimes: 0,
     }
   },
 
@@ -195,83 +204,181 @@ export default {
           break
       }
     },
-    $_initCascadeData() {
-      if (this.data.length === 0) {
-        return
-      }
-      this.isLoading = false
-      if (this.defaultIndex && this.defaultIndex.length > 0) {
-        let i = 0
-        const func = array => {
-          if (i < this.defaultIndex.length) {
-            const temp = this.defaultIndex[i]
-            array.forEach((item, eq) => {
-              if (eq === temp) {
-                this.subTitles.push(item.label)
-                this.renderData.push({index: i, clickedKey: temp, data: array})
-                if (item && item.children && Array.isArray(item.children)) {
-                  i++
-                  func(item.children)
-                }
-              }
-            })
-          } else {
-            this.defaultTabIndex = i
-            return false
-          }
-        }
-        func(this.data)
-      } else {
-        this.subTitles.push('请选择')
-        this.renderData.push({index: 0, clickedKey: -1, data: this.data})
-      }
-    },
     $_initNoCascadeData() {
       if (this.data.length === 0) {
         return
       }
       this.isLoading = false
+
+      const initialIndex = this.lastSelectIndex || this.defaultIndex
+      this.$_initTabContent()
+
       this.data.forEach((item, index) => {
         const temp = {
           index: index,
-          clickedKey: this.defaultIndex.length > 0 && ~this.defaultIndex[index] ? this.defaultIndex[index] : -1,
+          clickedKey: initialIndex.length > 0 && ~initialIndex[index] ? initialIndex[index] : -1,
           data: item.children,
         }
         this.renderData.push(temp)
         const currentColumn = this.renderData[index]
-        if (this.defaultIndex && this.defaultIndex.length > 0) {
+        if (initialIndex && initialIndex.length > 0) {
           this.subTitles.push(currentColumn.data[currentColumn.clickedKey].label)
         } else {
           this.subTitles.push(item.label)
         }
       })
     },
+    $_initCascadeData() {
+      if (this.data.length === 0) {
+        return
+      }
+      const initialIndex = this.lastSelectIndex || this.defaultIndex
+      this.$_walk(initialIndex, this.data)
+    },
     $_initAsyncCascadeData() {
-      this.asyncFunc(null, this.$_renderNextTabContent)
+      this.asyncFunc(null, this.$_renderInitalAsync)
     },
-    $_renderNextTabContent(err, data) {
-      this.isLoading = false
+    $_renderInitalAsync(err, data) {
       if (err) {
         this.isDataError = err
         return
       }
-      try {
-        this.subTitles.splice(this.currentIndex + 1, this.subTitles.length - 1, '请选择')
-        this.renderData.splice(this.currentIndex + 1, this.renderData.length - 1, {
-          index: this.currentIndex,
-          clickedKey: -1,
-          data: data.options,
-          asyncFunc: data.asyncFunc,
-        })
-        if (this.renderData.length > 1) {
-          this.$nextTick(() => {
-            this.$refs.tabs.selectTab(++this.currentIndex)
+      const initialIndex = this.lastSelectIndex || this.defaultIndex
+      this.$_walk(initialIndex, data, true)
+    },
+    $_walk(initialIndex, data, isAsync) {
+      // recursion cascade or async data with initialIndex
+      const func = () => {
+        if (initialIndex && initialIndex.length > 0) {
+          const walk = (err, data) => {
+            if (err) {
+              this.isLoading = false
+              this.isDataError = err
+              return
+            }
+            if (this.walkTimes < initialIndex.length) {
+              const temp = initialIndex[this.walkTimes]
+              let rawData = isAsync ? data.options : data
+              rawData.forEach((item, eq, array) => {
+                if (eq === temp) {
+                  this.currentIndex = this.walkTimes
+                  this.subTitles.splice(this.currentIndex, this.subTitles.length - 1, item.label)
+                  let renderContent = {
+                    index: this.walkTimes,
+                    clickedKey: temp,
+                    data: array,
+                  }
+                  if (isAsync) {
+                    renderContent = {
+                      ...renderContent,
+                      asyncFunc: data.asyncFunc,
+                    }
+                  }
+                  this.renderData.splice(this.currentIndex, this.renderData.length - 1, renderContent)
+                  this.$refs.tabs && this.$refs.tabs.selectTab(this.currentIndex)
+                  this.walkTimes++
+                  if (item && item.children && Array.isArray(item.children)) {
+                    walk(null, item.children)
+                  } else if (isAsync && data && data.asyncFunc && typeof data.asyncFunc === 'function') {
+                    data.asyncFunc(
+                      {
+                        index: this.walkTimes,
+                        item,
+                        eq,
+                      },
+                      walk,
+                    )
+                  } else {
+                    walk()
+                  }
+                }
+              })
+            } else {
+              this.isLoading = false
+              this.defaultTabIndex = this.walkTimes - 1
+              this.walkTimes = 0
+              return false
+            }
+          }
+          walk(null, data)
+        } else {
+          this.$_initTabContent()
+          this.subTitles.push('请选择')
+          if (isAsync) {
+            this.renderData.push({
+              index: 0,
+              clickedKey: -1,
+              data: data.options,
+              asyncFunc: data.asyncFunc,
+            })
+          } else {
+            this.renderData.push({
+              index: 0,
+              clickedKey: -1,
+              data: data,
+            })
+          }
+          this.isLoading = false
+        }
+      }
+      func()
+    },
+    $_initTabContent() {
+      this.subTitles = []
+      this.renderData = []
+      this.currentIndex = 0
+    },
+    $_renderNextTabContent(orignData) {
+      return (err, asyncData) => {
+        this.isLoading = false
+        if (err) {
+          this.isDataError = err
+          return
+        }
+        try {
+          let data,
+            asyncFunc = null
+          if (orignData) {
+            data = orignData
+          } else if (asyncData && asyncData.options) {
+            data = asyncData.options
+            if (asyncData.asyncFunc) {
+              asyncFunc = asyncData.asyncFunc
+            }
+          } else {
+            data = []
+          }
+          this.subTitles.splice(this.currentIndex + 1, this.subTitles.length - 1, '请选择')
+          this.renderData.splice(this.currentIndex + 1, this.renderData.length - 1, {
+            index: this.currentIndex,
+            clickedKey: -1,
+            data,
+            asyncFunc,
           })
+          if (this.renderData.length > 1) {
+            this.$nextTick(() => {
+              this.$refs.tabs.selectTab(++this.currentIndex)
+              setTimeout(() => {
+                this.currentColumnLock = false
+              }, 500)
+            })
+          }
+        } catch (error) {
+          this.isDataError = true
         }
-      } catch (error) {
-        this.isDataError = true
       }
     },
+    $_refreshTabPicker() {
+      // revoke this opration
+      this.isTabPickerShow = false
+      this.isLoading = true
+      this.isDataError = false
+      this.currentColumnLock = false
+      this.refreshTabPicker = Math.random()
+      this.$nextTick(() => {
+        this.$_initTabPicker()
+      })
+    },
 
     // MARK: events handler, 如 $_onButtonClick
     $_onShow() {
@@ -283,11 +390,22 @@ export default {
     $_onConfirm() {
       this.isTabPickerShow = false
       const selectedItem = this.getSelectedItem()
+      const isSelectPart = selectedItem.some(option => {
+        return !option
+      })
+      if (!isSelectPart) {
+        this.lastSelectIndex = selectedItem.map(option => {
+          return option.item.eq
+        })
+      }
       this.$emit('confirm', selectedItem)
     },
     $_onCancel() {
-      this.isTabPickerShow = false
       this.$emit('cancel')
+      this.$_refreshTabPicker()
+    },
+    $_onMaskClose() {
+      this.$_refreshTabPicker()
     },
     $_onRadioChange(value, index) {
       if (this.dataStruct === 'cascade' && this.currentColumnLock) {
@@ -304,18 +422,7 @@ export default {
       })
       if (this.dataStruct === 'cascade') {
         if (value && value.children && Array.isArray(value.children) && value.children.length > 0) {
-          this.subTitles.splice(this.currentIndex + 1, this.subTitles.length - 1, '请选择')
-          this.renderData.splice(this.currentIndex + 1, this.renderData.length - 1, {
-            index: ++this.currentIndex,
-            clickedKey: -1,
-            data: value.children,
-          })
-          this.$nextTick(() => {
-            this.$refs.tabs.selectTab(this.currentIndex)
-            setTimeout(() => {
-              this.currentColumnLock = false
-            }, 500)
-          })
+          this.$_renderNextTabContent(value.children)()
           return
         }
         this.currentColumnLock = false
@@ -327,7 +434,7 @@ export default {
         }
         // Object.assign(value, {index})
         this.isLoading = true
-        typeof currentColumn.asyncFunc === 'function' && currentColumn.asyncFunc(value, this.$_renderNextTabContent)
+        typeof currentColumn.asyncFunc === 'function' && currentColumn.asyncFunc(value, this.$_renderNextTabContent())
       }
     },
     $_onIndexChange(index) {
@@ -344,6 +451,7 @@ export default {
             item: {
               label: selected.label,
               value: selected.value,
+              eq: item.clickedKey,
             },
           }
         } else {
diff --git a/components/tab-picker/test/index.spec.js b/components/tab-picker/test/index.spec.js
index 52b650b72..792cd78a5 100644
--- a/components/tab-picker/test/index.spec.js
+++ b/components/tab-picker/test/index.spec.js
@@ -56,8 +56,10 @@ describe('TabPicker', () => {
         expect(wrapper.vm.renderData.length).to.equal(2)
         expect(wrapper.find('.md-tab-title').length).to.equal(2)
         wrapper.find('.md-popup-confirm')[0].trigger('click')
-        expect(eventStub.calledWith('confirm')).to.be.true
-        done()
+        setTimeout(() => {
+          expect(eventStub.calledWith('confirm')).to.be.true
+          done()
+        }, 200)
       }, 500)
     })
   })
@@ -152,8 +154,10 @@ describe('TabPicker', () => {
       expect(wrapper.find('.md-tab-title').length).to.equal(3)
       const confirmBtn = wrapper.find('.md-popup-confirm')[0]
       confirmBtn.trigger('click')
-      expect(eventStub.calledWith('confirm')).to.be.true
-      done()
+      setTimeout(() => {
+        expect(eventStub.calledWith('confirm')).to.be.true
+        done()
+      }, 200)
     })
   })
 })