MMStepper 步进器

Props

IStepperProps

属性	类型	默认值	必传	说明
value	number		是	值
min	number		否	最小值
max	number		否	最大值
step	number	1	否	步进
disabled	boolean		否	是否禁用
inputProps	InputProps		否	内容输入框部分
hiddenInZero	boolean		否	当
type	'number' | 'digit'	number	否	类型

代码示例

import { Component } from "react";
import MMStepper from "../../components/stepper/index";
import { View } from "@tarojs/components";
import MMNavigation from "../../components/navigation";
import PageDemoBlock from "../../components/pageComponents/pageDemoBlock";

export default class Index extends Component {
  state = {
    value: 5,
  };

  onChange = (value: number) => {
    this.setState({ value });
    // eslint-disable-next-line no-console
    console.log(value);
  };

  render() {
    const { value } = this.state;
    return (
      <View>
        <MMNavigation title="步进器" />

        <PageDemoBlock title="默认">
          <MMStepper
            value={value}
            onChange={(val) => this.setState({ value: val })}
          />
        </PageDemoBlock>

        <PageDemoBlock title="最小值(1)/最大值(10)">
          <MMStepper
            min={1}
            max={10}
            value={value}
            onChange={(val) => this.setState({ value: val })}
          />
        </PageDemoBlock>

        <PageDemoBlock title="步进(0.1)">
          <MMStepper
            step={0.1}
            value={value}
            onChange={(val) => this.setState({ value: val })}
          />
        </PageDemoBlock>

        <PageDemoBlock title="为0时不显示减号">
          <MMStepper
            hiddenInZero
            min={0}
            value={value}
            onChange={(val) => this.setState({ value: val })}
          />
        </PageDemoBlock>
      </View>
    );
  }
}