我的<Tab />
组件在包装到React Router Dom <Link />
中之前可以正常工作。我相信<Link />
将<a>
标签包裹在其子元素周围,从而导致样式替换。
另一种可能性是<Tab />
必须在<Tabs />
之下精确一层,样式才能正确通过。
如何解决此问题?我愿意使用其他库来覆盖Material UI的样式。
import React, {useState} from "react";
import AppBar from "@material-ui/core/AppBar";
import Tabs from '@material-ui/core/Tabs';
import Tab from '@material-ui/core/Tab';
import {Link} from "react-router-dom";
export default () => {
return (
<React.Fragment>
<AppBar position="static">
<Tabs value={adminView} centered>
<Link to='/add-coupon'> // adding this turns the styling into "classic blue underline"
<Tab
label="Add New Coupon"
value={addNewCoupon}
onClick={() => setAdminView(addNewCoupon)}
/>
</Link>
</Tabs>
</AppBar>
</React.Fragment>
)