feat: stepper 组件增加只读属性 (ant-design#1036)

HongHaiyang · Jan 18, 2024 · d8e738d · d8e738d
1 parent 07034fd
commit d8e738d
Show file tree

Hide file tree

Showing 4 changed files with 35 additions and 18 deletions.
diff --git a/demo/pages/Stepper/index.axml.tsx b/demo/pages/Stepper/index.axml.tsx
@@ -28,6 +28,9 @@ export default (_, { value, }: InternalData) => (
     <Container title="禁用状态">
       <Stepper defaultValue={0} disabled />
     </Container>
+    <Container title="输入框只读">
+      <Stepper defaultValue={0} inputReadOnly />
+    </Container>
     <Container title="受控组件">
       <Stepper
         value={value}

diff --git a/src/Stepper/index.axml.tsx b/src/Stepper/index.axml.tsx
@@ -14,6 +14,7 @@ export default (
     type,
     max,
     focus,
+    inputReadOnly,
   }: TSXMLProps<IStepperProps>,
   { mixin, enableNative, alwaysSystem, confirmType, confirmHold }
 ) => (
@@ -32,24 +33,30 @@ export default (
       onTap="onTap"
     />
     <View class="ant-stepper-input-wrap">
-      <AntInput
-        className={`ant-stepper-input ${
-          disabled ? 'ant-stepper-input-disabled' : ''
-        } ${inputClassName ? inputClassName : ''}`}
-        style={inputStyle}
-        type={type}
-        enableNative={enableNative}
-        alwaysSystem={alwaysSystem}
-        confirm-type={confirmType}
-        confirm-hold={confirmHold}
-        disabled={disabled}
-        focus={focus}
-        onChange="onChange"
-        onFocus="onFocus"
-        onBlur="onBlur"
-        onConfirm="onConfirm"
-        value={mixin.value}
-      />
+      {inputReadOnly ? (
+        <View class="ant-stepper-input ant-stepper-input-readonly">
+          {mixin.value}
+        </View>
+      ) : (
+        <AntInput
+          className={`ant-stepper-input ${
+            disabled ? 'ant-stepper-input-disabled' : ''
+          } ${inputClassName ? inputClassName : ''}`}
+          style={inputStyle}
+          type={type}
+          enableNative={enableNative}
+          alwaysSystem={alwaysSystem}
+          confirm-type={confirmType}
+          confirm-hold={confirmHold}
+          disabled={disabled}
+          focus={focus}
+          onChange="onChange"
+          onFocus="onFocus"
+          onBlur="onBlur"
+          onConfirm="onConfirm"
+          value={mixin.value}
+        />
+      )}
     </View>
     <AntButton
       className={`ant-stepper-button ant-stepper-button-up ${

diff --git a/src/Stepper/index.md b/src/Stepper/index.md
@@ -23,6 +23,7 @@ toc: 'content'
 | -----|-----|-----|----- |
 | className | 类名 | string | - | 
 | disabled |  是否禁用 | boolean | false |
+| inputReadOnly |  输入框是否只读状态 | boolean | false |
 | defaultValue |  初始值 | number | - |
 | focus |  输入框选中状态 | boolean | false |
 | inputClassName |  输入框类型 | string | - |

diff --git a/src/Stepper/props.ts b/src/Stepper/props.ts
@@ -52,6 +52,12 @@ export interface IStepperProps extends IBaseProps {
    */
   disabled?: boolean;
 
+  /**
+   * @description 输入框是否只读
+   * @default false
+   */
+  inputReadOnly?: boolean;
+
   /**
    * @description 输入框初始值
    */