首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >可以将Material-UI Link与react-router-dom Link一起使用吗?

可以将Material-UI Link与react-router-dom Link一起使用吗?
EN

Stack Overflow用户
提问于 2020-08-02 21:45:00
回答 1查看 2.3K关注 0票数 6

给定这两个组件:

从‘@material-ui/core/ Link’导入链接;从‘react-router-dom’导入{ Link };

有没有办法用react-router-dom的功能从Material-UI中获取样式?

EN

回答 1

Stack Overflow用户

发布于 2020-08-03 05:04:12

您可以使用Material的component属性-UI的Link来集成react-router-dom中的Link。你可以用Material-UI的Button做同样的事情。

下面的示例显示了这两种情况:

代码语言:javascript
复制
import React from "react";
import { Route } from "react-router";
import { BrowserRouter as Router, Link as RouterLink } from "react-router-dom";
import Link from "@material-ui/core/Link";
import Button from "@material-ui/core/Button";

export default function LinkRouter() {
  return (
    <Router>
      <div>
        <Link component={RouterLink} to="/">
          Link to Home
        </Link>
        <br />
        <Link component={RouterLink} to="/inner">
          Link to inner page
        </Link>
        <br />
        <Button
          variant="contained"
          color="primary"
          component={RouterLink}
          to="/inner"
        >
          Button to inner page
        </Button>
        <Route path="/" exact>
          <div>Here's Home</div>
        </Route>
        <Route path="/inner">
          <div>Here's the inner page</div>
        </Route>
      </div>
    </Router>
  );
}

文档:https://material-ui.com/guides/composition/#link

票数 12
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/63216730

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档