我想在配置了語意 UI 的選項卡串列頂部添加一個按鈕。目前我有 2 個選項卡，當它們被選中時可以切換到窗格，我有第三個選項卡 - 我不希望它在用戶單擊它時切換，而是發送一個事件（以擴展 UI）或者說一個警告訊息. 如何做到這一點？
uj5u.com熱心網友回復：
您需要利用受控狀態來獲得類似的結果。看看下面的例子：
example.js
import React, { useState } from "react";
import { Label, Menu, Tab } from "semantic-ui-react";
const panes = [
{
menuItem: { key: "users", icon: "users", content: "Users" },
render: () => <Tab.Pane>Tab 1 Content</Tab.Pane>
},
{
menuItem: (
<Menu.Item key="messages">
Messages<Label>15</Label>
</Menu.Item>
),
render: () => <Tab.Pane>Tab 2 Content</Tab.Pane>
},
{
menuItem: <Menu.Item key="open">Open</Menu.Item>
}
];
const TabExampleCustomMenuItem = () => {
const [activeIndex, setActiveIndex] = useState(0);
return (
<Tab
panes={panes}
activeIndex={activeIndex}
onTabChange={(e, data) => {
if (data.activeIndex === 2) {
alert(`You've clicked on the "Open" tab!`);
return;
}
setActiveIndex(data.activeIndex);
}}
/>
);
};
export default TabExampleCustomMenuItem;
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/533604.html
標籤：反应语义用户界面反应