From 97c1a7780d2c21f49bad9211473fef8b5fc01cd1 Mon Sep 17 00:00:00 2001
From: rex <rexkaneki@gmail.com>
Date: Tue, 22 Dec 2020 20:40:45 +0800
Subject: [PATCH] perf(stepper): use wxs (#3890)

---
 packages/stepper/index.ts   |  4 ++--
 packages/stepper/index.wxml |  7 ++++---
 packages/stepper/index.wxs  | 22 ++++++++++++++++++++++
 3 files changed, 28 insertions(+), 5 deletions(-)
 create mode 100644 packages/stepper/index.wxs

diff --git a/packages/stepper/index.ts b/packages/stepper/index.ts
index f762ae77..4b3dc85e 100644
--- a/packages/stepper/index.ts
+++ b/packages/stepper/index.ts
@@ -33,8 +33,8 @@ VantComponent({
       observer: 'check',
     },
     disabled: Boolean,
-    inputWidth: null,
-    buttonSize: null,
+    inputWidth: String,
+    buttonSize: String,
     asyncChange: Boolean,
     disableInput: Boolean,
     decimalLength: {
diff --git a/packages/stepper/index.wxml b/packages/stepper/index.wxml
index 95704208..eadee98c 100644
--- a/packages/stepper/index.wxml
+++ b/packages/stepper/index.wxml
@@ -1,10 +1,11 @@
 <wxs src="../wxs/utils.wxs" module="utils" />
+<wxs src="./index.wxs" module="computed" />
 
 <view class="van-stepper custom-class">
   <view
     wx:if="{{ showMinus }}"
     data-type="minus"
-    style="width: {{ utils.addUnit(buttonSize) }}; height: {{ utils.addUnit(buttonSize) }}"
+    style="{{ computed.buttonStyle({ buttonSize }) }}"
     class="minus-class {{ utils.bem('stepper__minus', { disabled: disabled || disableMinus || currentValue <= min }) }}"
     hover-class="van-stepper__minus--hover"
     hover-stay-time="70"
@@ -15,7 +16,7 @@
   <input
     type="{{ integer ? 'number' : 'digit' }}"
     class="input-class {{ utils.bem('stepper__input', { disabled: disabled || disableInput }) }}"
-    style="width: {{ utils.addUnit(inputWidth) }}; height: {{ utils.addUnit(buttonSize) }}"
+    style="{{ computed.inputStyle({ buttonSize, inputWidth }) }}"
     value="{{ currentValue }}"
     focus="{{ focus }}"
     disabled="{{ disabled || disableInput }}"
@@ -26,7 +27,7 @@
   <view
     wx:if="{{ showPlus }}"
     data-type="plus"
-    style="width: {{ utils.addUnit(buttonSize) }}; height: {{ utils.addUnit(buttonSize) }}"
+    style="{{ computed.buttonStyle({ buttonSize }) }}"
     class="plus-class {{ utils.bem('stepper__plus', { disabled: disabled || disablePlus || currentValue >= max }) }}"
     hover-class="van-stepper__plus--hover"
     hover-stay-time="70"
diff --git a/packages/stepper/index.wxs b/packages/stepper/index.wxs
new file mode 100644
index 00000000..a13e818b
--- /dev/null
+++ b/packages/stepper/index.wxs
@@ -0,0 +1,22 @@
+/* eslint-disable */
+var style = require('../wxs/style.wxs');
+var addUnit = require('../wxs/add-unit.wxs');
+
+function buttonStyle(data) {
+  return style({
+    width: addUnit(data.buttonSize),
+    height: addUnit(data.buttonSize),
+  });
+}
+
+function inputStyle(data) {
+  return style({
+    width: addUnit(data.inputWidth),
+    height: addUnit(data.buttonSize),
+  });
+}
+
+module.exports = {
+  buttonStyle: buttonStyle,
+  inputStyle: inputStyle,
+};