내비게이션을 복사해서 세 페이지에 붙여 넣으면 처음에는 빠릅니다. 그러나 메뉴 이름 하나를 바꾸려면 세 페이지를 모두 열어 세 번 고쳐야 하고, 한 곳이라도 빠뜨리면 페이지마다 내비게이션이 달라집니다. 페이지가 열 개로 늘어나면 문제도 열 배가 됩니다.

재사용 요소는 이 문제를 해결합니다. 한 번 만들어 두면 앱의 어느 페이지에든 배치할 수 있고, 원본을 고치면 배치된 모든 곳이 함께 바뀝니다.

재사용 요소는 두 부분으로 이루어집니다.

이 예제에서는 재사용 요소 RE_nav 하나를 만들어 세 페이지에 배치합니다.

페이지들을 모두 만들기 전에 공통된 부분을 미리 준비하고 싶을 때 쓰는 방법입니다.

페이지에 내비게이션 그룹을 이미 만들어 두었을 때 쓰는 방법입니다.

재사용 요소에는 사용자 정의 속성(custom property)을 추가할 수 있습니다. 속성을 쓰면 구조는 공유하면서도 인스턴스마다 다른 내용을 보여 줄 수 있습니다.

재사용 요소를 쓰는 이유를 직접 확인하는 단계입니다.

이 결과 세 페이지 모두 같은 변경이 반영되어 있어야 합니다. 정의에서 고친 내용은 앱 전체의 모든 인스턴스에 즉시 적용됩니다.

지금 어느 페이지에 있는지 내비게이션에서 알 수 있으면 사용자가 길을 잃지 않습니다. 그런데 RE_nav는 세 페이지가 똑같이 공유하는 하나의 정의입니다. 페이지마다 다르게 보이게 하려면, 재사용 요소가 "지금 내가 놓인 페이지가 어디인가"를 스스로 알아야 합니다.

Bubble은 이를 위해 Current page name이라는 데이터 소스를 제공합니다. 재사용 요소가 자신이 사용되고 있는 페이지의 이름을 알 수 있게 해 줍니다.