我是用了Tab组件,tab分1,2,3步骤,直接用ref不对。所以我找了这种方式,使用原生获取dom
const [ref1, setRef1] = useState(null);const [ref2, setRef2] = useState(null);const [ref3, setRef3] = useState(null);const [open, setOpen] = useState<boolean>(false);useEffect(() => {setRef1(document.getElementsByClassName('ant-tabs-tab')[0]);setRef2(document.getElementsByClassName('ant-tabs-tab')[1]);setRef3(document.getElementsByClassName('ant-tabs-tab')[2]);}, [])const steps: TourProps['steps'] = [{title: '',description: `1`,target: () => ref1,placement: 'bottom',},{title: '',description: `2`,target: () => ref2,},{title: '',description:`3 also support database data for reliable, efficient, secure and scalable data management.`,target: () => ref3,placement: 'bottom',nextButtonProps: {children: <span>Got It</span>,},},];const items: TabsProps['items'] = [{key: '1',label: 'Local',children: (<LocalData></LocalData>),},{key: '2',label: 'Cloud',children: (<CloudStorage></CloudStorage>),},{key: '3',label: 'SQL',children: (<SqlDatabases></SqlDatabases>),},];