MUI Core
MUI Core chứa các thư viện thành phần giao diện người dùng React cơ bản để cung cấp các tính năng mới nhanh hơn.
Material UI là một thư viện toàn diện các thành phần đi kèm với triển khai của chúng tôi về hệ thống Material Design của Google.
Joy UI là một thư viện giao diện người dùng React được thiết kế đẹp mắt.
Base UI là thư viện của chúng tôi về các thành phần “không có kiểu” và các hook cấp thấp. Với Base, bạn có toàn quyền kiểm soát hoạt động CSS và tính năng truy cập của ứng dụng của bạn.
MUI System là một bộ tiện ích CSS để giúp bạn nhanh chóng thiết kế tùy chỉnh.
Cài Đặt
Material UI
Material UI có sẵn dưới dạng một npm package.
npm:
npm install @mui/material @emotion/react @emotion/styled
yarn:
yarn add @mui/material @emotion/react @emotion/styled
Phiên bản cũ
Lưu ý: @next
chỉ trỏ đến phiên bản tiền phát hành. Sử dụng @latest
cho phiên bản ổn định mới nhất.
Base UI
Base UI có sẵn dưới dạng một npm package.
npm:
npm install @mui/base
yarn:
yarn add @mui/base
Lưu ý: Base UI vẫn đang trong phiên bản beta. Chúng tôi đang thêm các thành phần mới thường xuyên và bạn được chào đón đóng góp!
MUI System
Hệ thống MUI có sẵn dưới dạng một npm package.
npm:
npm install @mui/system @emotion/react @emotion/styled
yarn:
yarn add @mui/system @emotion/react @emotion/styled
Hoặc nếu bạn muốn sử dụng styled-components
như một công cụ tạo kiểu:
npm:
npm install @mui/material @mui/styled-engine-sc styled-components
yarn:
yarn add @mui/material @mui/styled-engine-sc styled-components
Ghé thăm trang styled-engine guide của chúng tôi để biết thêm thông tin về cách cấu hình styled-components
như công cụ tạo kiểu.
Nhà Tài Trợ
Kim Cương 💎
Nhà Tài Trợ Kim Cương là những người đã cam kết đóng góp $1,500/tháng hoặc hơn cho MUI.
Vàng 🏆
qua OpenCollective hoặc qua Patreon
Nhà Tài Trợ Vàng là những người đã cam kết đóng góp $500/tháng hoặc hơn cho MUI.
Thêm nhà đóng góp
Xem danh sách đầy đủ tại our backers.
Bắt đầu với Material UI
Đây là một ví dụ về ứng dụng cơ bản sử dụng thành phần Button
của Material UI:
import * as React from 'react';
import Button from '@mui/material/Button';
function App() {
return <Button variant="contained">Hello World</Button>;
}
Trong bản demo tương tác dưới đây, hãy thử thay đổi mã và xem cách nó ảnh hưởng đến kết quả. (Gợi ý: thay đổi variant
thành "outlined"
và color
thành "secondary"
. Để biết thêm tùy chọn, xem Button component page trong tài liệu của chúng tôi.)
Câu hỏi
Đối với câu hỏi về cách thực hiện mà không liên quan đến việc thay đổi mã nguồn, vui lòng sử dụng Stack Overflow thay vì sử dụng GitHub issues. Sử dụng thẻ “mui” trên Stack Overflow để giúp cộng đồng dễ dàng tìm thấy câu hỏi của bạn.
Ví dụ
Tài liệu của chúng tôi có a collection of example projects using Material UI.
Tài liệu
Giao diện cao cấp
Bạn có thể tìm thấy các mẫu và giao diện hoàn chỉnh tại MUI Store.
Đóng góp
Đọc hướng dẫn đóng góp để tìm hiểu về quy trình phát triển của chúng tôi, cách đề xuất sửa lỗi và cải thiện, và cách xây dựng và kiểm tra các thay đổi của bạn.
Đóng góp cho MUI Core không chỉ liên quan đến vấn đề và yêu cầu kéo (pull requests)! Có nhiều cách khác để support MUI ngoài việc đóng góp vào mã nguồn.
Nhật ký thay đổi
changelog được cập nhật thường xuyên để phản ánh những thay đổi trong mỗi phiên bản mới.
Lộ trình phát triển
Kế hoạch tương lai và các tính năng ưu tiên cao và cải tiến có thể được tìm thấy trong roadmap của chúng tôi.
Giấy phép
Dự án này được cấp phép dưới các điều khoản của giấy phép MIT.
Bảo mật
Để biết chi tiết về các phiên bản được hỗ trợ và thông tin liên hệ để báo cáo vấn đề bảo mật, vui lòng tham khảo security policy.
Các dịch vụ tài trợ
Các dịch vụ tuyệt vời này đang tài trợ cho cơ sở hạ tầng chính của MUI:
GitHub cho phép chúng tôi lưu trữ kho Git và điều phối các đóng góp.
Netlify cho phép chúng tôi phân phối tài liệu.
BrowserStack cho phép chúng tôi kiểm tra trên trình duyệt thực tế.
CodeCov cho phép chúng tôi theo dõi phạm vi kiểm tra.
Chi tiết tải về:
Tác giả: mui
Nguồn: https://github.com/mui/material-ui
Giấy phép: MIT license