我目前正在构建一个单页应用程序,使用 ReactJs 和 CSS 网格布局来放置和设置组件样式。
然而,这两种技术并不能很好地结合在一起:CSS 网格布局只能(很容易)应用于父容器的子元素(网格项)。但 ReactJS 的本质意味着具有孙子组件甚至曾孙组件的组件很常见。
举个例子:
React 组件树:App > ToDoList > ToDo Item > Details...
如果在单击时,我想将“ToDo Item”移动到“App”组件的网格行:1,似乎唯一的方法是让 ToDoList 本身成为整个 App 组件的网格。这会导致页面上其他元素的布局问题。
我认为这两种方法不能很好地协同工作是否正确,还是我对这两种技术的理解存在缺陷?
最佳答案
你是对的,子网格已从 CSS 网格候选建议 (https://github.com/w3c/csswg-drafts/issues/958) 中弃用。
希望它们能重新出现,它们似乎对简化复杂的布局非常有用。我只发现 CSS 网格在布置 React 应用程序或容器的顶层时很有用。
关于css - 你如何有效地将 CSS 网格布局与 React 结合使用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44409117/