All files / src/inputnumber/_example InputNumberExample.jsx

50% Statements 5/10
100% Branches 0/0
20% Functions 1/5
50% Lines 5/10

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57        1x 1x 1x 1x   1x                                                                                              
import React, { useState } from "react";
import { InputNumber } from "@tencent/tea-component/lib/inputnumber";
 
export default function InputNumberExample() {
  const [min, setMin] = useState(0);
  const [max, setMax] = useState(10);
  const [step, setStep] = useState(1);
  const [value, setValue] = useState(0);
 
  return (
    <>
      <section>
        <InputNumber
          value={value}
          onChange={value => {
            console.log(value);
            setValue(value);
          }}
          min={min}
          max={max}
          step={step}
          unit="台"
        />
      </section>
      <hr />
      <section>
        <p>变动下述属性对上方输入框进行调整:</p>
        <br />
        <label>
          最小值:
          <InputNumber
            value={min}
            max={max}
            onChange={value => setMin(value)}
          />
        </label>
        <label style={{ marginLeft: 10 }}>
          最大值:
          <InputNumber
            value={max}
            min={min}
            onChange={value => setMax(value)}
          />
        </label>
        <label style={{ marginLeft: 10 }}>
          步长:
          <InputNumber
            value={step}
            min={0}
            onChange={value => setStep(value)}
          />
        </label>
      </section>
    </>
  );
}