reactjs - 如何将 RouterLink 与 Microsoft FluentUI React Link 组件一起使用

Question

非常简单。我在其他 Microsoft Fluent UI 上看过 React Router Link 用法的例子控制。不过，我还没有找到将它与 Fluent UI Link 组件一起使用的方法。

Answer 1

能够使用在 Fluent UI Link implementation section 中找到的 as Prop 来实现这一点:

import React from 'react';
import { Link as RouterLink } from 'react-router-dom';

import { Link } from '@fluentui/react';

const ComponentName: React.FC = () => (
  <Link as={RouterLink} to="/pathName">
    Link Text
  </Link>
);

export default ComponentName;