So verwenden Sie useState auf der Registerkartenseite in Antd React
<p>类型 'readonly [{ readonly key: "1"; schreibgeschütztes Label: „Tab 1“; schreibgeschützte Kinder: „Inhalt von Registerkarte 1“; }, { schreibgeschützter Schlüssel: "2"; schreibgeschütztes Label: „Tab 2“; schreibgeschützte Kinder: „Inhalt von Registerkarte 2“; }, { ...; }]' oder 'readonly' 类型,不能赋值给可变类型 'Tab[]'。ts(4104)</p>
<pre class="brush:php;toolbar:false;">import React, { useState } from "react";
import „./index.css“;
{ Tabs } aus „antd“ importieren;
Importtyp { TabsProps } von „antd“;
const items: TabsProps["items"] = [
{
Schlüssel: „1“,
Beschriftung: „Tab 1“,
Kinder: „Inhalt von Registerkarte 1“.
},
{
Schlüssel: „2“,
Beschriftung: „Tab 2“,
Kinder: „Inhalt von Registerkarte 2“.
},
{
Schlüssel: „3“,
Beschriftung: „Tab 3“,
Kinder: „Inhalt von Registerkarte 3“.
}
] als const;
type ArrKey = typeof items[number]["key"];
const App: React.FC = () => {
const [index, setIndex] = useState<ArrKey>("1");
const onChange = (key: string) => {
setIndex(key);
};
return <Tabs activeKey={index} items={items} onChange={onChange} />;
};
Standard-App exportieren;</pre>
<p>https://codesandbox.io/s/basic-antd-5-8-3-forked-p9myfs?file=/demo.tsx:0-706</p>