指向 url 的语义 ui-react 下拉链接

Question

我有一个 Semantic UI React Dropdown 组件，其中包含类似的选项

const options = [
  { key: 'user', text: 'Account', icon: 'user' },
  { key: 'settings', text: 'Settings', icon: 'settings' },
  { key: 'sign-out', text: 'Sign Out', icon: 'sign out' },
]

我想将上述每个项目链接到一个 url，例如“/account”、“/settings”和“/logout”

我不确定如何触发此类操作。我没有看到任何 href 或道具。我猜我将不得不编写一个 onClick 或 onChange 函数？

Answer 1

简单的任务，不使用 onChange 改变路线：

import { Link } from 'react-router-dom';

const options = [
  { key: 'user', text: 'Account', icon: 'user', as: Link, to: '/my-account' },
  { key: 'settings', text: 'Settings', icon: 'settings' },
  { key: 'sign-out', text: 'Sign Out', icon: 'sign out' },
]