google的material-ui為什麼沒有柵格系統？

01-21

google的material-ui為什麼沒有柵格系統？

[Layout] Add a new component by oliviertassinari · Pull Request #5808 · callemall/material-ui

其實柵格系統已經在開發中，然而因為現在還沒有開發完成所以沒有公布出來。題主可以看這條PR

我個人覺得柵格系統還是非常有幫助的，單純的依靠className的css框架其實是anti-pattern，畢竟React不是倡導把所有的css放到component裡面嗎？比如著名的ant design不也有layout系統 @偏右

如果你指的是 Material-UI 這個庫。這是一個 React 組件庫，當然不會有 layout 的東西。

而且這個庫只是 Material Design 的一個實現，跟 Google 沒半毛錢關係。

Google 有自己的一個 CSS 庫 Material Design Lite，其中就有 Grid：Material Design Lite

其實react 版的 material-ui (v1-beta branch上)組件庫已經實現了其標準的response UI，該標準是基於12列的網格布局 (12-column Grid Layout) , 該 grid 在 layouts 之間創建了視覺的一致性，同時也允許和其他設計保持一定的靈活性。

該組件庫提供了一個 Grid 的組件，該組件實現了grid 整個布局系統，主要特點包括不限於：

使用css彈性盒子模型提供更高的靈活性；
提供 containers 和 items 2種類型布局；
寬度是通過百分比設定的，所以大小都是相對於父容器的；
項與項之間保持一定的空間，用戶可以指定spacing大小來調節項與項之間的padding；
提供 5 種 grid 大小單位 xs, sm, md, lg, and xl，分別作用於不同尺寸大小的屏幕。

具體詳情可以查看官方文檔對此的介紹。

同意樓上，如果想加柵格系統的話，可以再加一個skeleton小框架，因為它很輕量級

因為它是一個組件庫