Reactjs 如何在Fluent UI中使用网格布局

在我安装@fluentui/react之后，我尝试像这样使用网格

ReactDOM.render(
A.
B
,
document.getElementById（'root'））
);

但它不工作，其他控制组件工作正常。 我错过什么了吗

他们的文档只提到npm包。

你可以这样尝试

import React，{Component}来自'React'；
导入“office ui fabric react/dist/css/fabric.css”；
ReactDOM.render(
A.
B
,
document.getElementById（'root'））
);

清楚地表明，网格是一个遗留组件，不打算与Fluent UI React一起使用

你可以直接使用。有关Microsoft 365上下文中的示例，请查看

---

[更新]注意，Fluent UI Northstar（

@fluentui/react Northstar

）有一个。

哈哈哈，是我在他们的问题页面上大喊大叫，然后他们更改了他们的文档。哈哈，希望链接能帮助未来的读者。嗯，文档中说只有

ms Grid

类只有在使用Fabric Core时才可用，它没有提到这是一个遗留问题，或者我遗漏了什么？对，他们在另一页详细阐述了Fabric Core是遗留问题：下一次迭代Fluent UI Northstar使用了一个网格组件（！）。我的问题不太老。如果有人感兴趣。他们的大部分答案都是一个方向，不是事情的发展方向，但仍有助于澄清一些困惑。

ReactDOM.render(
  <React.StrictMode>
      <div className="ms-Grid" dir="ltr">
          <div className="ms-Grid-row">
              <div className="ms-Grid-col ms-sm4 ms-xl4">A</div>
              <div className="ms-Grid-col ms-sm8 ms-xl8">B</div>
          </div>
      </div>
  </React.StrictMode>,
  document.getElementById('root')
);