Question

在React spa中，尤其是在嵌套的子组件中，是否可以多次使用react-dom的渲染？例如：

index.jsx：

import React from 'react';
import { render } from 'react-dom';
import sampleComponent from './sampleComponent';

render(<SampleComponent />, document.getElementById('app'));

sampleComponent.jsx：

import React from 'react';
import { render } from 'react-dom';

const SampleComponent = () => (
  <div>
    <h1>hello world</h1>
    <div id="foo" />
  </div>
);

export default SampleComponent;


render(<h1>it's me again</h1>, document.getElementById('foo'));

Answer 1

多次使用渲染是一种复杂的方法。您不需要。

您已经创建了一个有效的组件。只需将其包装成另一个，再使用一次即可。例如：

const SampleComponent = () => (
  <div>
    <h1>hello world</h1>
    <div id="foo" />
  </div>
);

const WrapperComponent = () => (
  <div>
    <SampleComponent />
    <SampleComponent />
  </div>
);

export default WrapperComponent;

多次使用React-Dom渲染

1 个答案: