[bugfix] missing options (#624)

dist/area/index.js

@@ -1,154 +1,132 @@
 import { VantComponent } from '../common/component';
-
 VantComponent({
-  props: {
-    value: {
-      type: String,
-      observer(value) {
-        this.code = value;
-        this.setValues();
-      }
-    },
-    title: String,
-    loading: Boolean,
-    itemHeight: {
-      type: Number,
-      value: 44
-    },
-    visibleItemCount: {
-      type: Number,
-      value: 5
-    },
-    columnsNum: {
-      type: [String, Number],
-      value: 3
-    },
-    areaList: {
-      type: Object,
-      value: {},
-      observer() {
-        this.setValues();
-      }
-    }
-  },
-
-  data: {
-    pickerValue: [0, 0, 0],
-    columns: []
-  },
-
-  computed: {
-    displayColumns() {
-      const { columns = [], columnsNum } = this.data;
-      return columns.slice(0, +columnsNum);
-    }
-  },
-
-  methods: {
-    onCancel() {
-      this.triggerEvent('cancel', {
-        values: this.getValues(),
-        indexs: this.getIndexs()
-      });
-    },
-
-    onConfirm() {
-      this.triggerEvent('confirm', {
-        values: this.getValues(),
-        indexs: this.getIndexs()
-      });
-    },
-
-    onChange(event) {
-      const { value } = event.detail;
-      const { pickerValue, displayColumns } = this.data;
-      const index = pickerValue.findIndex((item, index) => item !== value[index]);
-      // 没有变更 或 选中项序号小于0 不处理
-      if (index < 0 || value[index] < 0) {
-        return;
-      }
-
-      const values = displayColumns[index];
-
-      this.code = values[value[index]].code;
-      this.setValues();
-      this.triggerEvent('change', {
-        picker: this,
-        values: this.getValues(),
-        index
-      });
-    },
-
-    getList(type, code) {
-      let result = [];
-      if (type !== 'province' && !code) {
-        return result;
-      }
-
-      const list = this.data.areaList[`${type}_list`] || {};
-      result = Object.keys(list).map(code => ({
-        code,
-        name: list[code]
-      }));
-
-      if (code) {
-        result = result.filter(item => item.code.indexOf(code) === 0);
-      }
-
-      return result;
-    },
-
-    getIndex(type, code) {
-      const compareNum = type === 'province' ? 2 : type === 'city' ? 4 : 6;
-      const list = this.getList(type, code.slice(0, compareNum - 2));
-      code = code.slice(0, compareNum);
-
-      for (let i = 0; i < list.length; i++) {
-        if (list[i].code.slice(0, compareNum) === code) {
-          return i;
+    props: {
+        title: String,
+        loading: Boolean,
+        value: {
+            type: String,
+            observer(value) {
+                this.code = value;
+                this.setValues();
+            }
+        },
+        itemHeight: {
+            type: Number,
+            value: 44
+        },
+        visibleItemCount: {
+            type: Number,
+            value: 5
+        },
+        columnsNum: {
+            type: [String, Number],
+            value: 3
+        },
+        areaList: {
+            type: Object,
+            value: {},
+            observer() {
+                this.setValues();
+            }
         }
-      }
-
-      return 0;
     },
-
-    setValues() {
-      let code = this.code || Object.keys(this.data.areaList.county_list)[0] || '';
-      const province = this.getList('province');
-      const city = this.getList('city', code.slice(0, 2));
-
-      this.setData({
-        'columns[0]': province,
-        'columns[1]': city
-      });
-
-      if (city.length && code.slice(2, 4) === '00') {
-        code = city[0].code;
-      }
-
-      this.setData({
-        'columns[2]': this.getList('county', code.slice(0, 4)),
-        pickerValue: [
-          this.getIndex('province', code),
-          this.getIndex('city', code),
-          this.getIndex('county', code)
-        ]
-      });
+    data: {
+        pickerValue: [0, 0, 0],
+        columns: []
     },
-
-    getValues() {
-      const { displayColumns = [], pickerValue = [] } = this.data;
-      return displayColumns.map((option, index) => option[pickerValue[index]]);
+    computed: {
+        displayColumns() {
+            const { columns = [], columnsNum } = this.data;
+            return columns.slice(0, +columnsNum);
+        }
     },
-
-    getIndexs() {
-      const { pickerValue, columnsNum } = this.data;
-      return pickerValue.slice(0, columnsNum);
-    },
-
-    reset() {
-      this.code = '';
-      this.setValues();
+    methods: {
+        onCancel() {
+            this.$emit('cancel', {
+                values: this.getValues(),
+                indexs: this.getIndexs()
+            });
+        },
+        onConfirm() {
+            this.$emit('confirm', {
+                values: this.getValues(),
+                indexs: this.getIndexs()
+            });
+        },
+        onChange(event) {
+            const { value } = event.detail;
+            const { pickerValue, displayColumns } = this.data;
+            const index = pickerValue.findIndex((item, index) => item !== value[index]);
+            // 没有变更 或 选中项序号小于0 不处理
+            if (index < 0 || value[index] < 0) {
+                return;
+            }
+            const values = displayColumns[index];
+            this.code = values[value[index]].code;
+            this.setValues();
+            this.$emit('change', {
+                picker: this,
+                values: this.getValues(),
+                index
+            });
+        },
+        getList(type, code) {
+            let result = [];
+            if (type !== 'province' && !code) {
+                return result;
+            }
+            const list = this.data.areaList[`${type}_list`] || {};
+            result = Object.keys(list).map(code => ({
+                code,
+                name: list[code]
+            }));
+            if (code) {
+                result = result.filter(item => item.code.indexOf(code) === 0);
+            }
+            return result;
+        },
+        getIndex(type, code) {
+            const compareNum = type === 'province' ? 2 : type === 'city' ? 4 : 6;
+            const list = this.getList(type, code.slice(0, compareNum - 2));
+            code = code.slice(0, compareNum);
+            for (let i = 0; i < list.length; i++) {
+                if (list[i].code.slice(0, compareNum) === code) {
+                    return i;
+                }
+            }
+            return 0;
+        },
+        setValues() {
+            let code = this.code || Object.keys(this.data.areaList.county_list)[0] || '';
+            const province = this.getList('province');
+            const city = this.getList('city', code.slice(0, 2));
+            this.setData({
+                'columns[0]': province,
+                'columns[1]': city
+            });
+            if (city.length && code.slice(2, 4) === '00') {
+                code = city[0].code;
+            }
+            this.setData({
+                'columns[2]': this.getList('county', code.slice(0, 4)),
+                pickerValue: [
+                    this.getIndex('province', code),
+                    this.getIndex('city', code),
+                    this.getIndex('county', code)
+                ]
+            });
+        },
+        getValues() {
+            const { displayColumns = [], pickerValue = [] } = this.data;
+            return displayColumns.map((option, index) => option[pickerValue[index]]);
+        },
+        getIndexs() {
+            const { pickerValue, columnsNum } = this.data;
+            return pickerValue.slice(0, columnsNum);
+        },
+        reset() {
+            this.code = '';
+            this.setValues();
+        }
     }
-  }
 });

dist/card/index.js

@@ -1,24 +1,22 @@
 import { VantComponent } from '../common/component';
-
 VantComponent({
-  classes: [
-    'thumb-class',
-    'title-class',
-    'price-class',
-    'desc-class',
-    'num-class'
-  ],
-
-  props: {
-    num: String,
-    desc: String,
-    thumb: String,
-    title: String,
-    price: String,
-    centered: Boolean,
-    currency: {
-      type: String,
-      value: '¥'
+    classes: [
+        'thumb-class',
+        'title-class',
+        'price-class',
+        'desc-class',
+        'num-class'
+    ],
+    props: {
+        num: String,
+        desc: String,
+        thumb: String,
+        title: String,
+        price: String,
+        centered: Boolean,
+        currency: {
+            type: String,
+            value: '¥'
+        }
     }
-  }
 });

dist/cell-group/index.js

@@ -1,10 +1,9 @@
 import { VantComponent } from '../common/component';
-
 VantComponent({
-  props: {
-    border: {
-      type: Boolean,
-      value: true
+    props: {
+        border: {
+            type: Boolean,
+            value: true
+        }
     }
-  }
 });

dist/cell/index.js

@@ -1,58 +1,53 @@
 import { VantComponent } from '../common/component';
-
 VantComponent({
-  classes: [
-    'title-class',
-    'label-class',
-    'value-class'
-  ],
-
-  props: {
-    title: null,
-    value: null,
-    url: String,
-    icon: String,
-    label: String,
-    center: Boolean,
-    isLink: Boolean,
-    required: Boolean,
-    clickable: Boolean,
-    titleWidth: String,
-    customStyle: String,
-    linkType: {
-      type: String,
-      value: 'navigateTo'
+    classes: [
+        'title-class',
+        'label-class',
+        'value-class'
+    ],
+    props: {
+        title: null,
+        value: null,
+        url: String,
+        icon: String,
+        label: String,
+        center: Boolean,
+        isLink: Boolean,
+        required: Boolean,
+        clickable: Boolean,
+        titleWidth: String,
+        customStyle: String,
+        linkType: {
+            type: String,
+            value: 'navigateTo'
+        },
+        border: {
+            type: Boolean,
+            value: true
+        }
     },
-    border: {
-      type: Boolean,
-      value: true
-    }
-  },
-
-  computed: {
-    cellClass() {
-      const { data } = this;
-      return this.classNames('custom-class', 'van-cell', {
-        'van-hairline': data.border,
-        'van-cell--center': data.center,
-        'van-cell--required': data.required,
-        'van-cell--clickable': data.isLink || data.clickable
-      });
+    computed: {
+        cellClass() {
+            const { data } = this;
+            return this.classNames('custom-class', 'van-cell', {
+                'van-hairline': data.border,
+                'van-cell--center': data.center,
+                'van-cell--required': data.required,
+                'van-cell--clickable': data.isLink || data.clickable
+            });
+        },
+        titleStyle() {
+            const { titleWidth } = this.data;
+            return titleWidth ? `max-width: ${titleWidth};min-width: ${titleWidth}` : '';
+        }
     },
-
-    titleStyle() {
-      const { titleWidth } = this.data;
-      return titleWidth ? `max-width: ${titleWidth};min-width: ${titleWidth}` : '';
+    methods: {
+        onClick() {
+            const { url } = this.data;
+            if (url) {
+                wx[this.data.linkType]({ url });
+            }
+            this.$emit('click');
+        }
     }
-  },
-
-  methods: {
-    onClick() {
-      const { url } = this.data;
-      if (url) {
-        wx[this.data.linkType]({ url });
-      }
-      this.$emit('click');
-    }
-  }
 });

dist/col/index.js

@@ -1,34 +1,33 @@
 import { VantComponent } from '../common/component';
-
 VantComponent({
-  relations: {
-    '../row/index': {
-      type: 'ancestor'
+    relations: {
+        '../row/index': {
+            type: 'ancestor'
+        }
+    },
+    props: {
+        span: Number,
+        offset: Number
+    },
+    data: {
+        style: ''
+    },
+    computed: {
+        classes() {
+            const { span, offset } = this.data;
+            return this.classNames('custom-class', 'van-col', {
+                [`van-col--${span}`]: span,
+                [`van-col--offset-${offset}`]: offset
+            });
+        }
+    },
+    methods: {
+        setGutter(gutter) {
+            const padding = `${gutter / 2}px`;
+            const style = gutter ? `padding-left: ${padding}; padding-right: ${padding};` : '';
+            if (style !== this.data.style) {
+                this.setData({ style });
+            }
+        }
     }
-  },
-
-  props: {
-    span: Number,
-    offset: Number
-  },
-
-  computed: {
-    classes() {
-      const { span, offset } = this.data;
-      return this.classNames('custom-class', 'van-col', {
-        [`van-col--${span}`]: span,
-        [`van-col--offset-${offset}`]: offset
-      });
-    }
-  },
-
-  methods: {
-    setGutter(gutter) {
-      const padding = `${gutter / 2}px`;
-      const style = gutter ? `padding-left: ${padding}; padding-right: ${padding};` : '';
-      if (style !== this.data.style) {
-        this.setData({ style });
-      }
-    }
-  }
 });

dist/common/component.js

@@ -1,47 +1,39 @@
 import { basic } from '../mixins/basic';
 import { observe } from '../mixins/observer/index';
+function mapKeys(source, target, map) {
+    Object.keys(map).forEach(key => {
+        target[map[key]] = source[key];
+    });
+}
 function VantComponent(sfc) {
     const options = {};
-    // map props to properties
-    if (sfc.props) {
-        options.properties = sfc.props;
-    }
-    // map mixins to behaviors
-    if (sfc.mixins) {
-        options.behaviors = sfc.mixins;
-    }
-    // copy methods
-    if (sfc.methods) {
-        options.methods = sfc.methods;
-    }
-    if (sfc.beforeCreate) {
-        options.created = sfc.beforeCreate;
-    }
-    if (sfc.created) {
-        options.attached = sfc.created;
-    }
-    if (sfc.mounted) {
-        options.ready = sfc.mounted;
-    }
-    if (sfc.destroyed) {
-        options.detached = sfc.destroyed;
-    }
-    // map classes to externalClasses
-    options.externalClasses = sfc.classes || [];
+    mapKeys(sfc, options, {
+        data: 'data',
+        props: 'properties',
+        mixins: 'behaviors',
+        methods: 'methods',
+        beforeCreate: 'created',
+        created: 'attached',
+        mounted: 'ready',
+        destroyed: 'detached',
+        relations: 'relations',
+        classes: 'externalClasses'
+    });
     // add default externalClasses
+    options.externalClasses = options.externalClasses || [];
     options.externalClasses.push('custom-class');
     // add default behaviors
-    options.behaviors = sfc.mixins || [];
+    options.behaviors = options.behaviors || [];
     options.behaviors.push(basic);
+    // map field to form-field behavior
+    if (sfc.field) {
+        options.behaviors.push('wx://form-field');
+    }
     // add default options
     options.options = {
         multipleSlots: true,
         addGlobalClass: true
     };
-    // map field to form-field behavior
-    if (sfc.field) {
-        options.behaviors.push('wx://form-field');
-    }
     observe(sfc, options);
     Component(options);
 }

dist/dialog/dialog.js

@@ -1,68 +1,44 @@
 let queue = [];
-
 const Dialog = options => {
-  return new Promise((resolve, reject) => {
-    const pages = getCurrentPages();
-    const ctx = pages[pages.length - 1];
-
-    const dialog = ctx.selectComponent(options.selector);
-    delete options.selector;
-
-    if (dialog) {
-      dialog.setData({
-        onCancel: reject,
-        onConfirm: resolve,
-        ...options
-      });
-      queue.push(dialog);
-    }
-  });
+    return new Promise((resolve, reject) => {
+        const pages = getCurrentPages();
+        const ctx = pages[pages.length - 1];
+        const dialog = ctx.selectComponent(options.selector);
+        delete options.selector;
+        if (dialog) {
+            dialog.setData(Object.assign({ onCancel: reject, onConfirm: resolve }, options));
+            queue.push(dialog);
+        }
+    });
 };
-
 Dialog.defaultOptions = {
-  show: true,
-  title: '',
-  message: '',
-  zIndex: 100,
-  overlay: true,
-  asyncClose: false,
-  selector: '#van-dialog',
-  confirmButtonText: '确认',
-  cancelButtonText: '取消',
-  showConfirmButton: true,
-  showCancelButton: false,
-  closeOnClickOverlay: false,
-  confirmButtonOpenType: ''
+    show: true,
+    title: '',
+    message: '',
+    zIndex: 100,
+    overlay: true,
+    asyncClose: false,
+    selector: '#van-dialog',
+    confirmButtonText: '确认',
+    cancelButtonText: '取消',
+    showConfirmButton: true,
+    showCancelButton: false,
+    closeOnClickOverlay: false,
+    confirmButtonOpenType: ''
 };
-
-Dialog.alert = options =>
-  Dialog({
-    ...Dialog.currentOptions,
-    ...options
-  });
-
-Dialog.confirm = options =>
-  Dialog({
-    ...Dialog.currentOptions,
-    showCancelButton: true,
-    ...options
-  });
-
+Dialog.alert = options => Dialog(Object.assign({}, Dialog.currentOptions, options));
+Dialog.confirm = options => Dialog(Object.assign({}, Dialog.currentOptions, { showCancelButton: true }, options));
 Dialog.close = () => {
-  queue.forEach(dialog => {
-    dialog.close();
-  });
-  queue = [];
+    queue.forEach(dialog => {
+        dialog.close();
+    });
+    queue = [];
 };
-
 Dialog.setDefaultOptions = options => {
-  Object.assign(Dialog.currentOptions, options);
+    Object.assign(Dialog.currentOptions, options);
 };
-
 Dialog.resetDefaultOptions = () => {
-  Dialog.currentOptions = { ...Dialog.defaultOptions };
+    Dialog.currentOptions = Object.assign({}, Dialog.defaultOptions);
 };
-
 Dialog.resetDefaultOptions();
-
 export default Dialog;

dist/dialog/index.js

@@ -1,97 +1,87 @@
 import { VantComponent } from '../common/component';
-
 VantComponent({
-  props: {
-    title: String,
-    message: String,
-    useSlot: Boolean,
-    asyncClose: Boolean,
-    showCancelButton: Boolean,
-    confirmButtonOpenType: String,
-    show: {
-      type: Boolean,
-      observer(show) {
-        if (!show) {
-          this.setData({
-            loading: {
-              confirm: false,
-              cancel: false
+    props: {
+        title: String,
+        message: String,
+        useSlot: Boolean,
+        asyncClose: Boolean,
+        showCancelButton: Boolean,
+        confirmButtonOpenType: String,
+        show: {
+            type: Boolean,
+            observer(show) {
+                if (!show) {
+                    this.setData({
+                        loading: {
+                            confirm: false,
+                            cancel: false
+                        }
+                    });
+                }
             }
-          });
+        },
+        zIndex: {
+            type: Number,
+            value: 100
+        },
+        confirmButtonText: {
+            type: String,
+            value: '确认'
+        },
+        cancelButtonText: {
+            type: String,
+            value: '取消'
+        },
+        showConfirmButton: {
+            type: Boolean,
+            value: true
+        },
+        overlay: {
+            type: Boolean,
+            value: true
+        },
+        closeOnClickOverlay: {
+            type: Boolean,
+            value: false
         }
-      }
     },
-    zIndex: {
-      type: Number,
-      value: 100
+    data: {
+        loading: {
+            confirm: false,
+            cancel: false
+        }
     },
-    confirmButtonText: {
-      type: String,
-      value: '确认'
-    },
-    cancelButtonText: {
-      type: String,
-      value: '取消'
-    },
-    showConfirmButton: {
-      type: Boolean,
-      value: true
-    },
-    overlay: {
-      type: Boolean,
-      value: true
-    },
-    closeOnClickOverlay: {
-      type: Boolean,
-      value: false
+    methods: {
+        onConfirm() {
+            this.handleAction('confirm');
+        },
+        onCancel() {
+            this.handleAction('cancel');
+        },
+        onClickOverlay() {
+            this.onClose('overlay');
+        },
+        handleAction(action) {
+            if (this.data.asyncClose) {
+                this.setData({
+                    [`loading.${action}`]: true
+                });
+            }
+            this.onClose(action);
+        },
+        close() {
+            this.setData({ show: false });
+        },
+        onClose(action) {
+            if (!this.data.asyncClose) {
+                this.close();
+            }
+            this.$emit('close', action);
+            this.$emit(action);
+            const callback = this.data[action === 'confirm' ? 'onConfirm' : 'onCancel'];
+            if (callback) {
+                callback(this);
+            }
+        }
     }
-  },
-
-  data: {
-    loading: {
-      confirm: false,
-      cancel: false
-    }
-  },
-
-  methods: {
-    onConfirm() {
-      this.handleAction('confirm');
-    },
-
-    onCancel() {
-      this.handleAction('cancel');
-    },
-
-    onClickOverlay() {
-      this.onClose('overlay');
-    },
-
-    handleAction(action) {
-      if (this.data.asyncClose) {
-        this.setData({
-          [`loading.${action}`]: true
-        });
-      }
-
-      this.onClose(action);
-    },
-
-    close() {
-      this.setData({ show: false });
-    },
-
-    onClose(action) {
-      if (!this.data.asyncClose) {
-        this.close();
-      }
-      this.$emit('close', action);
-      this.$emit(action);
-
-      const callback = this.data[action === 'confirm' ? 'onConfirm' : 'onCancel'];
-      if (callback) {
-        callback(this);
-      }
-    }
-  }
 });

dist/notice-bar/index.js

@@ -61,7 +61,7 @@ VantComponent({
     timer: null
   },
 
-  attached() {
+  created() {
     if (this.data.mode) {
       this.setData({
         hasRightIcon: true
@@ -69,7 +69,7 @@ VantComponent({
     }
   },
 
-  detached() {
+  destroyed() {
     const { timer } = this.data;
     timer && clearTimeout(timer);
   },

dist/progress/index.js

@@ -52,7 +52,7 @@ VantComponent({
     progressWidth: 0
   },
 
-  ready() {
+  mounted() {
     this.setText();
     this.setPivotStyle();
     this.getWidth();

dist/row/index.js

@@ -20,7 +20,7 @@ VantComponent({
     }
   },
 
-  ready() {
+  mounted() {
     if (this.data.gutter) {
       this.setGutter();
     }

dist/slider/index.js

@@ -28,7 +28,7 @@ VantComponent({
     }
   },
 
-  attached() {
+  created() {
     this.updateValue(this.data.value);
   },
 

dist/stepper/index.js

@@ -31,7 +31,7 @@ VantComponent({
     }
   },
 
-  attached() {
+  created() {
     this.setData({
       value: this.range(this.data.value)
     });

dist/steps/index.js

@@ -21,7 +21,7 @@ VantComponent({
     }
   },
 
-  attached() {
+  created() {
     this.formatSteps();
   },
 

dist/switch-cell/index.js

@@ -20,7 +20,7 @@ VantComponent({
     }
   },
 
-  attached() {
+  created() {
     this.setData({ value: this.data.checked });
   },
 

dist/switch/index.js

@@ -20,7 +20,7 @@ VantComponent({
     }
   },
 
-  attached() {
+  created() {
     this.setData({ value: this.data.checked });
   },
 

dist/tabbar/index.js

@@ -24,7 +24,7 @@ VantComponent({
     currentActive: -1
   },
 
-  attached() {
+  created() {
     this.setData({ currentActive: this.data.active });
   },
 

dist/tabs/index.js

@@ -67,7 +67,7 @@ VantComponent({
     scrollLeft: 0
   },
 
-  ready() {
+  mounted() {
     this.setLine();
     this.scrollIntoView();
   },

packages/area/index.ts

@@ -1,7 +1,14 @@
 import { VantComponent } from '../common/component';
 
+type AreaItem = {
+  name: string;
+  code: string;
+};
+
 VantComponent({
   props: {
+    title: String,
+    loading: Boolean,
     value: {
       type: String,
       observer(value) {
@@ -9,8 +16,6 @@ VantComponent({
         this.setValues();
       }
     },
-    title: String,
-    loading: Boolean,
     itemHeight: {
       type: Number,
       value: 44
@@ -46,20 +51,20 @@ VantComponent({
 
   methods: {
     onCancel() {
-      this.triggerEvent('cancel', {
+      this.$emit('cancel', {
         values: this.getValues(),
         indexs: this.getIndexs()
       });
     },
 
     onConfirm() {
-      this.triggerEvent('confirm', {
+      this.$emit('confirm', {
         values: this.getValues(),
         indexs: this.getIndexs()
       });
     },
 
-    onChange(event) {
+    onChange(event: Weapp.Event) {
       const { value } = event.detail;
       const { pickerValue, displayColumns } = this.data;
       const index = pickerValue.findIndex((item, index) => item !== value[index]);
@@ -72,14 +77,14 @@ VantComponent({
 
       this.code = values[value[index]].code;
       this.setValues();
-      this.triggerEvent('change', {
+      this.$emit('change', {
         picker: this,
         values: this.getValues(),
         index
       });
     },
 
-    getList(type, code) {
+    getList(type: string, code?: string): AreaItem[] {
       let result = [];
       if (type !== 'province' && !code) {
         return result;
@@ -98,7 +103,7 @@ VantComponent({
       return result;
     },
 
-    getIndex(type, code) {
+    getIndex(type: string, code: string): number {
       const compareNum = type === 'province' ? 2 : type === 'city' ? 4 : 6;
       const list = this.getList(type, code.slice(0, compareNum - 2));
       code = code.slice(0, compareNum);

packages/cell/index.ts

@@ -30,7 +30,7 @@ VantComponent({
   },
 
   computed: {
-    cellClass() {
+    cellClass(): string {
       const { data } = this;
       return this.classNames('custom-class', 'van-cell', {
         'van-hairline': data.border,
@@ -40,7 +40,7 @@ VantComponent({
       });
     },
 
-    titleStyle() {
+    titleStyle(): string {
       const { titleWidth } = this.data;
       return titleWidth ? `max-width: ${titleWidth};min-width: ${titleWidth}` : '';
     }

packages/col/index.ts

@@ -12,8 +12,12 @@ VantComponent({
     offset: Number
   },
 
+  data: {
+    style: ''
+  },
+
   computed: {
-    classes() {
+    classes(): string {
       const { span, offset } = this.data;
       return this.classNames('custom-class', 'van-col', {
         [`van-col--${span}`]: span,
@@ -23,7 +27,7 @@ VantComponent({
   },
 
   methods: {
-    setGutter(gutter) {
+    setGutter(gutter: number) {
       const padding = `${gutter / 2}px`;
       const style = gutter ? `padding-left: ${padding}; padding-right: ${padding};` : '';
       if (style !== this.data.style) {

packages/common/component.ts

@@ -5,6 +5,12 @@ import {
   CombinedComponentInstance
 } from '../../types/index';
 
+function mapKeys(source: object, target: object, map: object) {
+  Object.keys(map).forEach(key => {
+    target[map[key]] = source[key];
+  });
+}
+
 function VantComponent<Data, Props, Methods, Computed>(
   sfc: VantComponentOptions<
     Data,
@@ -16,58 +22,38 @@ function VantComponent<Data, Props, Methods, Computed>(
 ): void {
   const options: any = {};
 
-  // map props to properties
-  if (sfc.props) {
-    options.properties = sfc.props;
-  }
-
-  // map mixins to behaviors
-  if (sfc.mixins) {
-    options.behaviors = sfc.mixins;
-  }
-
-  // copy methods
-  if (sfc.methods) {
-    options.methods = sfc.methods;
-  }
-
-  if (sfc.beforeCreate) {
-    options.created = sfc.beforeCreate;
-  }
-
-  if (sfc.created) {
-    options.attached = sfc.created;
-  }
-
-  if (sfc.mounted) {
-    options.ready = sfc.mounted;
-  }
-
-  if (sfc.destroyed) {
-    options.detached = sfc.destroyed;
-  }
-
-  // map classes to externalClasses
-  options.externalClasses = sfc.classes || [];
+  mapKeys(sfc, options, {
+    data: 'data',
+    props: 'properties',
+    mixins: 'behaviors',
+    methods: 'methods',
+    beforeCreate: 'created',
+    created: 'attached',
+    mounted: 'ready',
+    destroyed: 'detached',
+    relations: 'relations',
+    classes: 'externalClasses'
+  });
 
   // add default externalClasses
+  options.externalClasses = options.externalClasses || [];
   options.externalClasses.push('custom-class');
 
   // add default behaviors
-  options.behaviors = sfc.mixins || [];
+  options.behaviors = options.behaviors || [];
   options.behaviors.push(basic);
 
+  // map field to form-field behavior
+  if (sfc.field) {
+    options.behaviors.push('wx://form-field');
+  }
+
   // add default options
   options.options = {
     multipleSlots: true,
     addGlobalClass: true
   };
 
-  // map field to form-field behavior
-  if (sfc.field) {
-    options.behaviors.push('wx://form-field');
-  }
-
   observe(sfc, options);
   Component(options);
 }

packages/dialog/dialog.ts

@@ -1,6 +1,35 @@
 let queue = [];
 
-const Dialog = options => {
+type DialogAction = 'confirm' | 'cancel';
+type DialogOptions = {
+  show?: boolean;
+  title?: string;
+  zIndex?: number;
+  message?: string;
+  overlay?: boolean;
+  selector?: string;
+  asyncClose?: boolean;
+  confirmButtonText?: string;
+  cancelButtonText?: string;
+  showConfirmButton?: boolean;
+  showCancelButton?: boolean;
+  closeOnClickOverlay?: boolean;
+  confirmButtonOpenType?: string;
+}
+
+interface Dialog {
+  (options: DialogOptions): Promise<DialogAction>;
+  alert?: (options: DialogOptions) => Promise<DialogAction>;
+  confirm?: (options: DialogOptions) => Promise<DialogAction>;
+  close?: () => void;
+  install?: () => void;
+  setDefaultOptions?: (options: DialogOptions) => void;
+  resetDefaultOptions?: () => void;
+  defaultOptions?: DialogOptions;
+  currentOptions?: DialogOptions;
+}
+
+const Dialog: Dialog = options => {
   return new Promise((resolve, reject) => {
     const pages = getCurrentPages();
     const ctx = pages[pages.length - 1];

packages/notice-bar/index.js

@@ -61,7 +61,7 @@ VantComponent({
     timer: null
   },
 
-  attached() {
+  created() {
     if (this.data.mode) {
       this.setData({
         hasRightIcon: true
@@ -69,7 +69,7 @@ VantComponent({
     }
   },
 
-  detached() {
+  destroyed() {
     const { timer } = this.data;
     timer && clearTimeout(timer);
   },

packages/progress/index.js

@@ -52,7 +52,7 @@ VantComponent({
     progressWidth: 0
   },
 
-  ready() {
+  mounted() {
     this.setText();
     this.setPivotStyle();
     this.getWidth();

packages/row/index.js

@@ -20,7 +20,7 @@ VantComponent({
     }
   },
 
-  ready() {
+  mounted() {
     if (this.data.gutter) {
       this.setGutter();
     }

packages/slider/index.js

@@ -28,7 +28,7 @@ VantComponent({
     }
   },
 
-  attached() {
+  created() {
     this.updateValue(this.data.value);
   },
 

packages/stepper/index.js

@@ -31,7 +31,7 @@ VantComponent({
     }
   },
 
-  attached() {
+  created() {
     this.setData({
       value: this.range(this.data.value)
     });

packages/steps/index.js

@@ -21,7 +21,7 @@ VantComponent({
     }
   },
 
-  attached() {
+  created() {
     this.formatSteps();
   },
 

packages/switch-cell/index.js

@@ -20,7 +20,7 @@ VantComponent({
     }
   },
 
-  attached() {
+  created() {
     this.setData({ value: this.data.checked });
   },
 

packages/switch/index.js

@@ -20,7 +20,7 @@ VantComponent({
     }
   },
 
-  attached() {
+  created() {
     this.setData({ value: this.data.checked });
   },
 

packages/tabbar/index.js

@@ -24,7 +24,7 @@ VantComponent({
     currentActive: -1
   },
 
-  attached() {
+  created() {
     this.setData({ currentActive: this.data.active });
   },
 

packages/tabs/index.js

@@ -67,7 +67,7 @@ VantComponent({
     scrollLeft: 0
   },
 
-  ready() {
+  mounted() {
     this.setLine();
     this.scrollIntoView();
   },

types/index.d.ts

@@ -14,8 +14,8 @@ type Relations<Instance> = {
   };
 };
 type RecordToAny<T> = { [K in keyof T]: any };
-type Accessors<T> = {
-  [K in keyof T]: (() => T[K])
+type RecordToReturn<T> = {
+  [P in keyof T]: T[P] extends (...args: any[]) => any ? ReturnType<T[P]> : T[P]
 }
 
 export type CombinedComponentInstance<
@@ -27,15 +27,15 @@ export type CombinedComponentInstance<
   LooseObject &
   Weapp.Component &
   ComponentInstance & {
-    data: Data & RecordToAny<Props> & Computed;
+    data: Data & RecordToAny<Props> & RecordToReturn<Computed>;
   };
 
 export type VantComponentOptions<Data, Props, Methods, Computed, Instance> = {
   data?: Data;
-  props?: Props;
+  props?: Props & ThisType<Instance>;
   field?: boolean;
   mixins?: Mixins;
-  computed?: Accessors<Computed> & ThisType<Instance>;
+  computed?: Computed & ThisType<Instance>;
   relations?: Relations<Instance>;
   classes?: ExternalClasses;
   methods?: Methods & ThisType<Instance>;

types/instance.ts

@@ -1,6 +1,7 @@
 import { classNames } from './class-names';
 
 export interface ComponentInstance {
+  triggerEvent: never;
   $emit(name: string, detail?: any): void;
   classNames: classNames;
 }

types/weapp.d.ts

@@ -1,5 +1,11 @@
 declare function Component(options: any): void;
 
+interface wx {
+  [key: string]: any
+}
+
+declare const wx: wx;
+
 declare namespace Weapp {
   interface Component {
     getRelationNodes(selector: string): any[];
@@ -14,6 +20,7 @@ declare namespace Weapp {
 
   interface Event {
     type: string;
+    detail: any;
     timeStamp: number;
     target: Target;
     currentTarget: Target;
@@ -31,8 +38,4 @@ declare namespace Weapp {
     touches: Array<Touch>;
     changedTouches: Array<Touch>;
   }
-
-  interface CustomEvent extends Event {
-    detail: any;
-  }
 }