• InputNumber 输入框
    • 使用指南
    • 一般用法
    • 每次点击改变 0.1
    • 禁止状态
    • 自定义宽度
    • 参数
    • 事件

    InputNumber 输入框

    带加减按钮的数字输入框，用户可以控制每次点击增加的数值，支持小数，同时支持自定义输入框宽度。

    使用指南

    在 Taro 文件中引入组件

    :::demo

    1. import { AtInputNumber } from 'taro-ui'

    :::

    一般用法

    :::demo

    1. <AtInputNumber
    2.   min={0}
    3.   max={10}
    4.   step={1}
    5.   value={this.state.number}
    6.   onChange={this.handleChange}
    7. />

    :::

    每次点击改变 0.1

    :::demo

    1. <AtInputNumber
    2.   min={0}
    3.   max={10}
    4.   step={0.1}
    5.   value={this.state.number}
    6.   onChange={this.handleChange}
    7. />

    :::

    禁止状态

    :::demo

    1. <AtInputNumber
    2.   disabled
    3.   min={0}
    4.   max={10}
    5.   step={1}
    6.   value={this.state.number}
    7.   onChange={this.handleChange}
    8. />

    :::

    自定义宽度

    :::demo

    1. <AtInputNumber
    2.   min={0}
    3.   max={10}
    4.   step={1}
    5.   width={200}
    6.   value={this.state.number}
    7.   onChange={this.handleChange}
    8. />

    :::

    参数

    参数 说明 类型 可选值 默认值
    value 输入框值 Number - 1
    width input 宽度,不包括两侧按钮，单位根据环境转为 rpx 或 rem Number - 120
    min 最小值 Number - 0
    max 最大值 Number - 100
    step 每次点击改变的间隔大小 Number - 1
    disabled 是否禁止输入，禁止点击按钮 Boolean - false

    事件

    事件名称 说明 返回参数
    onChange 输入框值改变时触发的事件 输入框当前值 value