fix(Circle): initial ctx (#2005)

packages/area/index.ts

@@ -37,7 +37,7 @@ VantComponent({
     areaList: 'setValues',
 
     columnsNum(value: number) {
-      this.set({
+      this.setData({
         displayColumns: this.data.columns.slice(0, +value)
       });
     }

packages/checkbox-group/index.ts

@@ -39,7 +39,7 @@ VantComponent({
 
     updateChild(child: WechatMiniprogram.Component.TrivialInstance) {
       const { value, disabled } = this.data;
-      child.set({
+      child.setData({
         value: value.indexOf(child.data.name) !== -1,
         disabled: disabled || child.data.disabled
       });

packages/circle/index.ts

@@ -57,10 +57,10 @@ VantComponent({
 
   methods: {
     getContext() {
-      if (this.ctx) {
+      if (!this.ctx) {
-        return this.ctx;
+        this.ctx = wx.createCanvasContext('van-circle', this);
       }
-      this.ctx = wx.createCanvasContext('van-circle', this);
+      return this.ctx;
     },
 
     setHoverColor() {
@@ -76,18 +76,14 @@ VantComponent({
         hoverColor = LinearColor;
       }
 
-      this.set({
+      this.setData({ hoverColor });
-        hoverColor
-      });
     },
 
     setStyle() {
       const { size } = this.data;
       const style = `width: ${size}px; height: ${size}px;`;
 
-      this.set({
+      this.setData({ style });
-        style
-      });
     },
 
     presetCanvas(context, strokeStyle, beginAngle, endAngle, fill) {

packages/col/index.ts

@@ -19,8 +19,9 @@ VantComponent({
     setGutter(gutter: number) {
       const padding = `${gutter / 2}px`;
       const style = gutter ? `padding-left: ${padding}; padding-right: ${padding};` : '';
+
       if (style !== this.data.style) {
-        this.set({ style });
+        this.setData({ style });
       }
     }
   }

packages/collapse-item/index.ts

@@ -47,7 +47,7 @@ VantComponent({
           data.contentHeight = 'auto';
         }
 
-        this.set(data);
+        this.setData(data);
       });
   },
 
@@ -109,7 +109,7 @@ VantComponent({
 
     onTransitionEnd() {
       if (this.data.expanded) {
-        this.set({
+        this.setData({
           contentHeight: 'auto'
         });
       }

packages/dialog/dialog.ts

@@ -63,7 +63,7 @@ const Dialog: Dialog = options => {
     delete options.selector;
 
     if (dialog) {
-      dialog.set({
+      dialog.setData({
         onCancel: reject,
         onConfirm: resolve,
         ...options

packages/dialog/index.ts

@@ -73,7 +73,7 @@ VantComponent({
 
     handleAction(action: Action) {
       if (this.data.asyncClose) {
-        this.set({
+        this.setData({
           [`loading.${action}`]: true
         });
       }
@@ -82,13 +82,13 @@ VantComponent({
     },
 
     close() {
-      this.set({
+      this.setData({
         show: false
       });
     },
 
     stopLoading() {
-      this.set({
+      this.setData({
         loading: {
           confirm: false,
           cancel: false

packages/field/index.ts

@@ -82,18 +82,18 @@ VantComponent({
     onInput(event: Weapp.Event) {
       const { value = '' } = event.detail || {};
 
-      this.set({ value }, () => {
+      this.setData({ value }, () => {
         this.emitChange(value);
       });
     },
 
     onFocus(event: Weapp.Event) {
-      this.set({ focused: true });
+      this.setData({ focused: true });
       this.$emit('focus', event.detail);
     },
 
     onBlur(event: Weapp.Event) {
-      this.set({ focused: false });
+      this.setData({ focused: false });
       this.$emit('blur', event.detail);
     },
 
@@ -102,7 +102,7 @@ VantComponent({
     },
 
     onClear() {
-      this.set({ value: '' }, () => {
+      this.setData({ value: '' }, () => {
         this.emitChange('');
         this.$emit('clear', '');
       });

packages/icon/index.ts

@@ -34,7 +34,7 @@ VantComponent({
     },
 
     setSizeWithUnit(size: string | number): void {
-      this.set({
+      this.setData({
         sizeWithUnit: addUnit(size)
       });
     }

packages/loading/index.ts

@@ -23,7 +23,7 @@ VantComponent({
 
   methods: {
     setSizeWithUnit(size: string | number): void {
-      this.set({
+      this.setData({
         sizeWithUnit: addUnit(size)
       });
     }

packages/mixins/safe-area.ts

@@ -41,7 +41,7 @@ export const safeArea = ({
 
     created() {
       getSafeArea().then(({ isIPhoneX, statusBarHeight }) => {
-        this.set({ isIPhoneX, statusBarHeight });
+        this.setData({ isIPhoneX, statusBarHeight });
       });
     }
   });

packages/mixins/transition.ts

@@ -64,7 +64,7 @@ export const transition = function (showDefaultValue: boolean) {
           .then(() => {
             this.checkStatus('enter');
 
-            this.set({
+            this.setData({
               inited: true,
               display: true,
               classes: classNames.enter,
@@ -75,7 +75,7 @@ export const transition = function (showDefaultValue: boolean) {
           .then(() => {
             this.checkStatus('enter');
 
-            this.set({
+            this.setData({
               classes: classNames['enter-to']
             });
           })
@@ -94,7 +94,7 @@ export const transition = function (showDefaultValue: boolean) {
           .then(() => {
             this.checkStatus('leave');
 
-            this.set({
+            this.setData({
               classes: classNames.leave,
               currentDuration
             });
@@ -103,8 +103,7 @@ export const transition = function (showDefaultValue: boolean) {
           .then(nextTick)
           .then(() => {
             this.checkStatus('leave');
-
+            this.setData({
-            this.set({
               classes: classNames['leave-to']
             });
           })

packages/notice-bar/index.ts

@@ -55,7 +55,7 @@ VantComponent({
 
   watch: {
     text() {
-      this.set({}, this.init);
+      this.setData({}, this.init);
     }
   },
 
@@ -109,7 +109,7 @@ VantComponent({
       this.timer && clearTimeout(this.timer);
       this.timer = null;
 
-      this.set({
+      this.setData({
         animationData: this.resetAnimation
           .translateX(this.wrapWidth)
           .step()
@@ -117,7 +117,7 @@ VantComponent({
       });
 
       setTimeout(() => {
-        this.set({
+        this.setData({
           animationData: this.animation
             .translateX(-this.contentWidth)
             .step()
@@ -134,7 +134,7 @@ VantComponent({
       this.timer && clearTimeout(this.timer);
       this.timer = null;
 
-      this.set({ show: false });
+      this.setData({ show: false });
     },
 
     onClick(event: Weapp.Event) {

packages/notify/index.ts

@@ -30,7 +30,7 @@ VantComponent({
       const { duration } = this.data;
 
       clearTimeout(this.timer);
-      this.set({
+      this.setData({
         show: true
       });
 
@@ -43,7 +43,7 @@ VantComponent({
 
     hide() {
       clearTimeout(this.timer);
-      this.set({
+      this.setData({
         show: false
       });
     }

packages/picker-column/index.ts

@@ -54,7 +54,7 @@ VantComponent({
     },
 
     onTouchStart(event: Weapp.TouchEvent) {
-      this.set({
+      this.setData({
         startY: event.touches[0].clientY,
         startOffset: this.data.offset,
         duration: 0
@@ -64,7 +64,7 @@ VantComponent({
     onTouchMove(event: Weapp.TouchEvent) {
       const { data } = this;
       const deltaY = event.touches[0].clientY - data.startY;
-      this.set({
+      this.setData({
         offset: range(
           data.startOffset + deltaY,
           -(this.getCount() * data.itemHeight),
@@ -76,9 +76,8 @@ VantComponent({
     onTouchEnd() {
       const { data } = this;
       if (data.offset !== data.startOffset) {
-        this.set({
+        this.setData({ duration: DEFAULT_DURATION });
-          duration: DEFAULT_DURATION
+
-        });
         const index = range(
           Math.round(-data.offset / data.itemHeight),
           0,

packages/popup/index.ts

@@ -74,7 +74,7 @@ VantComponent({
         updateData.duration = 0;
       }
 
-      this.set(updateData);
+      this.setData(updateData);
     }
   }
 });

packages/radio-group/index.ts

@@ -38,7 +38,7 @@ VantComponent({
 
     updateChild(child: WechatMiniprogram.Component.TrivialInstance) {
       const { value, disabled } = this.data;
-      child.set({
+      child.setData({
         value,
         disabled: disabled || child.data.disabled
       });

packages/rate/index.ts

@@ -55,20 +55,20 @@ VantComponent({
   watch: {
     value(value: number) {
       if (value !== this.data.innerValue) {
-        this.set({ innerValue: value });
+        this.setData({ innerValue: value });
       }
     }
   },
 
   methods: {
     setSizeWithUnit(val) {
-      this.set({
+      this.setData({
         sizeWithUnit: addUnit(val)
       });
     },
 
     setGutterWithUnit(val) {
-      this.set({
+      this.setData({
         gutterWithUnit: addUnit(val)
       });
     },
@@ -77,7 +77,7 @@ VantComponent({
       const { data } = this;
       const { score } = event.currentTarget.dataset;
       if (!data.disabled && !data.readonly) {
-        this.set({ innerValue: score + 1 });
+        this.setData({ innerValue: score + 1 });
         this.$emit('input', score + 1);
         this.$emit('change', score + 1);
       }

packages/row/index.ts

@@ -33,7 +33,7 @@ VantComponent({
         ? `margin-right: ${margin}; margin-left: ${margin};`
         : '';
 
-      this.set({ style });
+      this.setData({ style });
       this.getRelationNodes('../col/index').forEach(col => {
         col.setGutter(this.data.gutter);
       });

packages/search/index.ts

@@ -37,17 +37,17 @@ VantComponent({
 
   methods: {
     onChange(event: Weapp.Event) {
-      this.set({ value: event.detail });
+      this.setData({ value: event.detail });
       this.$emit('change', event.detail);
     },
 
     onCancel() {
       /**
        * 修复修改输入框值时，输入框失焦和赋值同时触发，赋值失效
-       * // https://github.com/youzan/vant-weapp/issues/1768
+       * https://github.com/youzan/vant-weapp/issues/1768
        */
       setTimeout(() => {
-        this.set({ value: '' });
+        this.setData({ value: '' });
         this.$emit('cancel');
         this.$emit('change', '');
       }, 200);

packages/sidebar-item/index.ts

@@ -31,7 +31,7 @@ VantComponent({
     },
 
     setActive(active: boolean) {
-      return this.set({ active });
+      return this.setData({ active });
     }
   }
 });

packages/slider/index.ts

@@ -83,7 +83,7 @@ VantComponent({
       const { barHeight, min } = this.data;
       const width = `${((value - min) * 100) / this.getRange()}%`;
 
-      this.set({
+      this.setData({
         value,
         barStyle: `width: ${width}; height: ${addUnit(barHeight)};`
       });

packages/stepper/index.ts

@@ -48,7 +48,7 @@ VantComponent({
       const newValue = this.range(value);
 
       if (typeof newValue === 'number' && +this.data.value !== newValue) {
-        this.set({ value: newValue });
+        this.setData({ value: newValue });
       }
     }
   },
@@ -58,7 +58,7 @@ VantComponent({
   },
 
   created() {
-    this.set({
+    this.setData({
       value: this.range(this.data.value)
     });
   },
@@ -114,7 +114,7 @@ VantComponent({
     },
 
     triggerInput(value: string) {
-      this.set({
+      this.setData({
         value: this.data.asyncChange ? this.data.value : value
       });
       this.$emit('change', value);

packages/sticky/index.ts

@@ -59,13 +59,13 @@ VantComponent({
       }
 
       if (JSON.stringify(data) !== '{}') {
-        this.set(data);
+        this.setData(data);
       }
     },
 
     setPosition(position: Position) {
       if (position !== this.data.position) {
-        this.set({ position });
+        this.setData({ position });
         nextTick(() => {
           this.setWrapStyle();
         });

packages/submit-bar/index.ts

@@ -45,14 +45,14 @@ VantComponent({
   methods: {
     updatePrice() {
       const { price, decimalLength } = this.data;
-      this.set({
+      this.setData({
         hasPrice: typeof price === 'number',
         priceStr: (price / 100).toFixed(decimalLength)
       });
     },
 
     updateTip() {
-      this.set({ hasTip: typeof this.data.tip === 'string' });
+      this.setData({ hasTip: typeof this.data.tip === 'string' });
     },
 
     onSubmit(event: Weapp.Event) {

packages/swipe-cell/index.ts

@@ -47,7 +47,7 @@ VantComponent({
         ? 'none'
         : 'transform .6s cubic-bezier(0.18, 0.89, 0.32, 1)';
 
-      this.set({
+      this.setData({
         wrapperStyle: `
         -webkit-transform: ${transform};
         -webkit-transition: ${transition};
@@ -68,7 +68,7 @@ VantComponent({
       } else {
         this.swipeMove(0);
       }
-      this.set({ catchMove: false });
+      this.setData({ catchMove: false });
     },
 
     startDrag(event: Weapp.TouchEvent) {
@@ -93,7 +93,7 @@ VantComponent({
 
       if (!this.firstDirection) {
         this.firstDirection = this.direction;
-        this.set({ catchMove: this.firstDirection === 'horizontal' });
+        this.setData({ catchMove: this.firstDirection === 'horizontal' });
       }
 
       if (this.firstDirection === 'vertical') {

packages/switch/index.ts

@@ -27,12 +27,12 @@ VantComponent({
 
   watch: {
     checked(value) {
-      this.set({ value });
+      this.setData({ value });
     }
   },
 
   created() {
-    this.set({ value: this.data.checked });
+    this.setData({ value: this.data.checked });
   },
 
   methods: {

packages/tabs/index.ts

@@ -88,7 +88,7 @@ VantComponent({
 
   watch: {
     swipeThreshold() {
-      this.set({
+      this.setData({
         scrollable: this.child.length > this.data.swipeThreshold
       });
     },
@@ -125,7 +125,7 @@ VantComponent({
   methods: {
     updateTabs(tabs: TabItemData[]) {
       tabs = tabs || this.data.tabs;
-      this.set({
+      this.setData({
         tabs,
         scrollable: tabs.length > this.data.swipeThreshold
       });
@@ -152,7 +152,7 @@ VantComponent({
     setActive(active: number) {
       if (active !== this.data.active) {
         this.trigger('change', active);
-        this.set({ active });
+        this.setData({ active });
         this.setActiveTab();
       }
     },
@@ -180,7 +180,7 @@ VantComponent({
             ? ''
             : `transition-duration: ${duration}s; -webkit-transition-duration: ${duration}s;`;
 
-          this.set({
+          this.setData({
             lineStyle: `
             ${height}
             width: ${width}px;
@@ -203,20 +203,20 @@ VantComponent({
         (rect: WechatMiniprogram.BoundingClientRectCallbackResult) => {
           const { width } = rect;
 
-          this.set({
+          this.setData({
             trackStyle: `
-            width: ${width * this.child.length}px;
+              width: ${width * this.child.length}px;
-            left: ${-1 * active * width}px;
+              left: ${-1 * active * width}px;
-            transition: left ${duration}s;
+              transition: left ${duration}s;
-            display: -webkit-box;
+              display: -webkit-box;
-            display: flex;
+              display: flex;
-          `
+            `
           });
 
-          const props = { width, animated };
+          const data = { width, animated };
 
           this.child.forEach((item: WechatMiniprogram.Component.TrivialInstance) => {
-            item.set(props);
+            item.setData(data);
           });
         }
       );
@@ -233,7 +233,7 @@ VantComponent({
         }
 
         if (data.active !== item.data.active) {
-          item.set(data);
+          item.setData(data);
         }
       });
 
@@ -265,7 +265,7 @@ VantComponent({
             .slice(0, active)
             .reduce((prev, curr) => prev + curr.width, 0);
 
-          this.set({
+          this.setData({
             scrollLeft: offsetLeft - (navRect.width - tabRect.width) / 2
           });
         }
@@ -326,10 +326,9 @@ VantComponent({
           wrapStyle = '';
       }
 
-      // cut down `set`
+      if (wrapStyle !== this.data.wrapStyle) {
-      if (wrapStyle === this.data.wrapStyle) return;
+        this.setData({ wrapStyle });
-
+      }
-      this.set({ wrapStyle });
     },
 
     observerContentScroll() {

packages/toast/toast.ts

@@ -60,7 +60,7 @@ function Toast(toastOptions: ToastOptions | ToastMessage): WechatMiniprogram.Com
   delete options.selector;
 
   toast.clear = () => {
-    toast.set({ show: false });
+    toast.setData({ show: false });
 
     if (options.onClose) {
       options.onClose();
@@ -68,7 +68,7 @@ function Toast(toastOptions: ToastOptions | ToastMessage): WechatMiniprogram.Com
   };
 
   queue.push(toast);
-  toast.set(options);
+  toast.setData(options);
   clearTimeout(toast.timer);
 
   if (options.duration > 0) {

packages/tree-select/index.ts

@@ -71,7 +71,7 @@ VantComponent({
       const { children = [] } = items[mainActiveIndex] || {};
 
       this.updateItemHeight(children);
-      return this.set({ subItems: children });
+      return this.setData({ subItems: children });
     },
 
     // 更新组件整体高度，根据最大高度和当前组件需要展示的高度来决定
@@ -82,14 +82,14 @@ VantComponent({
         subItems.length * ITEM_HEIGHT
       );
 
-      this.set({ mainHeight: Math.min(maxHeight, this.data.maxHeight) });
+      this.setData({ mainHeight: Math.min(maxHeight, this.data.maxHeight) });
     },
 
     // 更新子项列表高度，根据可展示的最大高度和当前子项列表的高度决定
     updateItemHeight(subItems) {
       const itemHeight = Math.min(subItems.length * ITEM_HEIGHT, this.data.maxHeight);
 
-      return this.set({ itemHeight });
+      return this.setData({ itemHeight });
     }
   }
 });