Question

在一个React文件中，我有以下内容：

 ReactDOM.render(
   <BlogButton />,
   document.getElementById('nav-blog--react')
 );

 ReactDOM.render(
   <NavButton />,
   document.getElementById('nav-home--react')
  );

  ReactDOM.render(
   <PoweredByButton />,
   document.getElementById('nav-powered--react')
  );

只有第一个渲染工作：＆＃34; BlogButton＆＃34;出现。另外两个，＆＃34; NavButton＆＃34;和＆＃34; PoweredbyButton＆＃34;不要表现出来。我也没有在控制台中收到错误。那是因为你不能在文件中有多个渲染吗？我如何将所有这些组合成一个渲染调用？

Answer 1

虽然我无法解释你为什么你的例子不起作用 - 从我所知道并在反应文档中读到的，“go-to”方法是创建一个包含其他所有东西的主要/包装组件。

您可以将包装器组件视为附加新元素的新DOM。

我建议你创建一个直接渲染到DOM中的包装组件。而其他元素则在包装器组件中呈现。

WrapperComponent
...
render(
<div>
<FirstComponent />
<SecondComponent />
</div>
);


ReactDOM.render(
   <WrapperComponent />,
   document.getElementById('nav-powered--react')
  );

通过React.js渲染多个类/对象？

1 个答案: