javascript - 반응 구성 요소의 가상 DOM 조작

Question

설명: 저는 ReactJS 초보자입니다.
요구사항은 다음과 같습니다.
1.react 컴포넌트 aa.jsx

으아악

2. 반응 컴포넌트 bb.jsx

으아악

3. React의 메인 입구인 main.jsx는 json 파일을 기반으로 필수 구성요소를 로드해야 합니다

으아악

하지만 문제는 여기 페이지가 모두 기능이라는 것입니다. dom 블록(p 요소)을 꺼내서 index.html 페이지의 지정된 dom 요소에 하나씩 추가하는 방법입니다.

Answer 1

먼저 이해가 안되는 점은 aa.jsx와 bb.jsx가 너무 비슷한데 왜 두개를 쓰시는 걸까요(물론 편의상 예시를 쓴 것일 수도 있습니다). 여러 개의 서로 다른 파일이므로 서로 다른 React 구성요소입니다. 특정 DOM 아래에서 모두 렌더링하려면 배열에 직접 넣으세요.

아래 코드를 테스트하지는 않았지만 작동할 것입니다

으아아아

JSX 코드 삽입 위치

으아아아

언제든지 업데이트하고 싶다면 다시 렌더링하면 됩니다. this.state.comComponents를 사용하면 됩니다

번역된 React 문서를 살펴보세요

Answer 2

가상돔과는 아무런 관련이 없습니다. 왜 이렇게 사용하는지 모르겠지만~ 하지만 이렇게 사용하면 잘못된 것입니다!