跳转到内容

学习资源

Material-UI 新手? 我们为你精心准备的学习资源,可以帮助你快速入门。

第一个组件

下面的代码片段展示了一个基本的Material UI应用,它有一个 <Button> 组件:

import * as React from 'react';
import Button from '@mui/material/Button';

function App() {
  return <Button variant="contained">Hello World</Button>;
}

在下面的交互式演示中,尝试更改代码并查看它如何影响输出。 (注:将 varian 更改为 "outlined" 并且 color 更改为 "secondary"。 For more options, see the Button component page.)

示例项目

Visit the example projects page to see how we recommend implementing Material UI with various React libraries and frameworks like Next.js, Gatsby, Create React App, and more.

模板

Check out our selection of basic templates to get started building your next app more quickly.

除了官方文档外,还有无数来自社区的成员,他们创建了非常好的教程和指南指导如何使用Material UI。

以下是我们找到的一些最好的第三方学习资源,可以学习如何使用我们的组件来构建漂亮的应用。

免费的资源