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 | 1x 1x 1x | import React, { Fragment, useState } from "react"; import { Stepper } from "@tencent/tea-component/lib/stepper"; import { Switch } from "@tencent/tea-component/lib/switch"; export default function StepperExample() { const steps = [ { id: "prepare", label: "备案类型" }, { id: "info", label: "备案信息" }, { id: "upload", label: "上传资料", detail: ( <Fragment> <strong>资料审核中</strong> <br /> 腾讯云会在 <strong>1 个工作日内</strong>审核完成,请耐心等候。 <a>催单处理</a> </Fragment> ), }, { id: "photo", label: "办理拍照" }, { id: "finish", label: "完成备案" }, ]; const [dot, setDot] = useState(false); return ( <Fragment> <Stepper type={dot ? "process-vertical-dot" : "process-vertical"} current="upload" steps={steps} /> <section> <Switch value={dot} onChange={value => setDot(value)}> 使用圆点样式 </Switch> </section> </Fragment> ); } |