임베딩용 구성요소

복잡한 레이아웃을 보다 효과적으로 구성하고 유지 관리하기 위해 구성요소를 서로 내장하는 작업을 시작하세요. 예를 들어 버튼을 구성 요소로 변환하는 것을 고려해 보세요. 나중에 이 버튼 구성 요소를 사이트 전체의 다양한 다른 구성 요소에 포함할 수 있습니다. 탐색 구성 요소, 히어로 섹션 구성 요소 또는 기능 카드 구성 요소 내에 배치하면 중앙 위치에서 각 구성 요소를 개별적으로 업데이트하고 다른 모든 인스턴스를 통해 변경 사항이 연속적으로 적용되는 것을 확인할 수 있는 유연성이 제공됩니다.

이 세션에서는 다음을 가르칩니다.

1. 기존 구성 요소를 삽입하는 기술
2. 기존 구성 요소의 일부에서 새 중첩 구성 요소를 디자인하는 절차
3. 중첩된 구성 요소 속성과 상위 구성 요소 속성 간의 링크 설정

기존 구성요소 포함

다른 구성요소 내에 기존 구성요소를 포함하려면 다음을 수행하십시오.

1. 다른 구성요소를 배치하기 위해 원하는 구성요소를 선택하세요.
2. 기본 구성요소 수정
3. 액세스 구성요소패널 (또는 키보드 단축키를 활용하세요. 옮기다 + ㅏ)
4. 패널에서 구성 요소를 드래그하여 캔버스 또는 탐색기에서 선택한 구성 요소에 놓습니다.

기존 요소에서 새 중첩 구성요소 작성

기존 구성요소 내에서 새로운 구성요소를 제작하려면 다음을 수행하세요.

1. 다른 컴포넌트를 삽입하려는 컴포넌트를 선택하세요.
2. 주요 구성 요소 수정
3. 컴포넌트로 변환하기 위해 원하는 요소를 선택하세요
4. 액세스 스타일패널 아니면 그 요소 설정패널
5. '라고 표시된 아이콘을 클릭하세요.구성요소 생성" 패널 상단에
6. 새 구성 요소의 이름을 지정하고 누르십시오. 만들다

또한 이미 구성 요소를 호스팅하는 상위 요소에서 구성 요소를 생성하여 상위 구성 요소 내에 중첩된 하위 구성 요소를 생성할 수도 있습니다.

중첩된 구성요소 속성을 상위 구성요소 속성과 정렬

이미 정의된 구성 요소 속성을 갖춘 구성 요소를 구성 요소 속성도 보유하는 다른 구성 요소 내에 포함하면 중첩된 구성 요소의 속성을 상위 구성 요소의 속성에 연결하도록 선택할 수 있습니다. 이는 중첩된 구성 요소 속성이 상위 구성 요소 인스턴스의 변경된 값을 활용할 수 있는 길을 열어줍니다.

예를 들어 헤더, 본문 텍스트, 버튼이 포함된 카드가 있다고 상상해 보세요. 카드는 구성 요소로 작동하는 반면, 카드 내의 버튼 요소는 구성 요소(예: 중첩 구성 요소)로 사용됩니다. 구성 요소 내의 각 요소가 정의된 구성 요소 속성과 함께 제공되는 경우 버튼 텍스트를 카드 내의 텍스트에 연결하는 옵션이 유지됩니다.

중첩된 구성 요소의 속성과 상위 구성 요소의 속성 간의 연결을 설정하려면 다음을 수행하십시오.

1. 중첩된 구성 요소가 포함된 상위 구성 요소를 선택하고 해당 기본 구성 요소를 수정합니다.
2. 상위 구성 요소 속성에 대한 연결이 필요한 요소를 포함하는 중첩 구성 요소의 기본 구성 요소를 수정합니다.
3. 요소를 클릭하세요.
4. 다음으로 이동하세요. 요소 설정패널 속성을 생성하고
5. 중첩된 구성 요소의 주요 구성 요소를 종료합니다.
6. 상위 컴포넌트의 기본 컴포넌트로 이동
7. 오른쪽 패널에 액세스
8. 보라색 '을 클릭하세요.점연결 속성 옆에 있는 ' 아이콘
9. 선택하다 "새 속성 생성 및 연결” 그리고 속성을 생성합니다.
10. 상위 구성 요소의 주요 구성 요소 종료
11. 상위 구성요소의 인스턴스를 선택하세요.
12. 오른쪽 패널을 방문하세요.
13. 속성에 값을 할당합니다.