我正在使用 react js 来开发我的 Web 应用程序,并且我正在为 UI 使用 React Material 设计。下面是我指的网址。
https://material-ui-next.com/
我正在努力实现这样的目标
我正在使用选项卡,但无法像我共享的图像一样获得两行文本。我可以使用图像和标签,或者如果标签太大,那么它会进入多行。我怎样才能像图像一样实现两行文本
最佳答案
这是一个老问题,但我看到没有人回答它。
为了获得标签标签的多行和多样式,您需要将标签和值放在两个不同的项目中。 (确保首先将它们包装在 div 中)
MUI @1.0.0 中的首选方法是使用 <Typography />
标签。
查看 typography docs对于所有变体。
所以它看起来像这样:
<Tab
value={this.state.value}
label={
<div>
<Typography variant="caption">
Following
</Typography>
<Typography variant="title">
58
</Typography>
</div>
}
/>
但是,由于您的所有选项卡都需要它,您可能应该创建一个函数来处理它。
我根据提供的 MUI 示例创建了一个沙箱 here :https://codesandbox.io/s/vw6107rv3
关于reactjs - 如何使用 React Material UI 实现多行标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46969060/