구성요소 추가 및 구성
에서 페이지에 UI 빌더구성요소를 추가하는 방법에 대해 알아봅니다. 구성요소를 추가하여 페이지가 빌드됩니다.
시작하기 전에
필요한 역할: ui_builder_admin
이 태스크 정보
구성요소는 에서 사용자 지정 페이지를 UI 빌더만드는 데 사용되는 구성요소입니다. 페이지에 구성요소를 추가하는 방법에 대해 알아봅니다. 페이지에 구성요소를 추가한 후에는 구성요소를 구성해야 합니다. 구성요소 구성에 대한 자세한 내용은 개발자 사이트의 구성요소 설명서 를 ServiceNow 참조하십시오.
프로시저
-
페이지에 구성요소를 추가합니다.
UI 빌더 선택할 수 있는 구성요소 라이브러리가 함께 제공됩니다. 구성요소를 페이지의 구성요소로 추가합니다. 예를 들어 제목, 데이터 시각화 등을 추가할 수 있습니다. 다음 표에서는 페이지에 구성요소를 추가할 수 있는 여러 방법을 보여줍니다.
구성요소를 추가하려면 수행 방법 페이지에서 직접 페이지에서 + 를 선택하고 도구 상자에서 구성요소를 선택합니다. 구성요소를 검색하거나 목록을 스크롤할 수 있습니다. 페이지 위의 플로팅 메뉴 구성요소 위의 부동 메뉴를 선택합니다. - 이전 추가 또는 이후에 추가를 선택합니다.
- 도구 상자에서 구성요소를 선택합니다.
콘텐츠 트리 다음 두 가지 방법으로 컨텐츠 트리에서 구성요소를 추가할 수 있습니다. - 콘텐츠 트리에서 컨테이너 아래에 +콘텐츠 추가 를 선택합니다. 그런 다음 도구 상자에서 구성요소를 선택합니다.
- 컨텐츠 트리의 컨테이너 위로 마우스 장치를 이동하고, 메뉴 아이콘을 선택하고, 구성요소 추가를 선택합니다. 그런 다음 도구 상자에서 구성요소를 선택합니다.
-
이제 방금 추가한 구성요소의 속성을 구성합니다.
구성요소를 구성한다는 것은 필요에 맞게 구성요소를 사용자 지정하는 것을 의미합니다. 구성요소 구성에 대한 자세한 내용은 다음을 참조하십시오. 넥스트 경험 구성 요소.
-
구성 가능한 JSON 속성이 있는 구성요소의 경우 의 로우코드 JSON 편집기를 사용하여 UI 빌더JSON 코드를 편집할 필요 없이 구성요소 속성을 편집할 수 있습니다.
JSON 편집기 UI에는 더미 데이터 또는 정의된 값에 정의되지 않은 속성이 포함되도록, 사용 가능한 모든 속성이 표시됩니다. JSON 편집기 내에서 속성을 업데이트하거나 사용자 지정 속성을 추가할 수 있습니다. 구성요소 구성에 대한 자세한 내용은 다음 문서를 참조하십시오 Now 코드 편집기로 코드 편집(고급 기능).
주:로우코드 JSON 편집기는 스키마가 있고 JSON 입력이 해당 스키마와 일치하는 속성에만 사용할 수 있습니다.로우코드 JSON 편집기는 단순 객체, 단순 배열 속성, 복합 배열, 객체 배열을 지원하고 부분적으로 복합 객체를 지원합니다. 복합 배열의 경우 배열 항목의 위치를 추가, 삭제 또는 이동할 수 있습니다. 단순화된 편집 환경을 위해 설정 되지 않은 항목 숨기기 를 선택하여 비어 있거나 null 값이 있는 객체를 숨길 수도 있습니다.
-
컨테이너 구성요소로 작업할 때 부동 패널을 사용하여 일부 스타일을 편집할 수 있습니다.
메뉴를 보려면 메뉴 아이콘을 선택합니다.
레이아웃,크기 조정 또는 간격 옵션을 선택하여 가장 일반적인 옵션이 표시된 부동 패널을 엽니다. 필요에 따라 부동 패널을 다른 위치로 드래그합니다. 한 번에 하나의 부동 패널만 열 수 있습니다.
구성요소 구성에 대한 자세한 내용은 다음을 참조하십시오. 넥스트 경험 구성 요소. -
구성 가능한 JSON 속성이 있는 구성요소의 경우 의 로우코드 JSON 편집기를 사용하여 UI 빌더JSON 코드를 편집할 필요 없이 구성요소 속성을 편집할 수 있습니다.
- 옵션:
페이지에 있는 구성요소의 위쪽 또는 아래쪽에 있는 + 를 선택하여 페이지에 구성요소를 더 추가합니다( + 가 + 추가로 변경됨).
- 구성요소의 맨 위에 있는 + 를 선택하여 기존 구성요소 앞에 구성요소를 추가하거나 구성요소 맨 아래에 있는 + 를 선택하여 구성요소 뒤에 구성요소를 삽입합니다.
- 구성요소 목록에서 구성요소를 끌어 기존 구성요소 앞이나 뒤에 구성요소를 삽입합니다.
다음에 수행할 작업
페이지에 구성요소를 추가하고 구성했습니다. 자세한 내용은 UI 빌더 페이지에서 데이터를 동적으로 노출(고급 기능) 문서를 참조하십시오. 의 UI 빌더 데이터 자원은 구성요소에 컨텐츠를 표시하기 위해 페이지가 가져오는 데이터입니다. 구성요소는 데이터 자원을 사용하여 다양한 환경에서 데이터와 구성을 재사용하고 페이지에서 구성요소를 동적으로 만듭니다.
구성요소 수식 편집기에서 UI 빌더 지원되는 함수
구성요소 수식 편집기에서 UI 빌더 지원되는 다양한 기능에 대해 알아봅니다.
다음 표에는 구성요소 수식 편집기에서 사용할 수 있는 함수가 UI 빌더 나열되어 있습니다. 구성요소 수식 편집기에 대한 자세한 내용은 다음 문서를 참조하십시오 구성요소를 사용하여 페이지 사용자 지정 UI 빌더.
| 연산자 레이블 | 조건 예시 | 동등한 쿼리 연산자 | 예제 쿼리 | 출력 예 |
|---|---|---|---|---|
| 모두 비어 있음 | [간단한 설명][ALL_EMPTY] | ALL_EMPTY | short_descriptionALL_EMPTY | 간단한 설명 필드에 값이 없는 모든 기록입니다. |
| 모두 같음 | [간단한 설명][ALL_EQ][네트워크 저장소 사용할 수 없음] | ALL_EQ | short_description=네트워크 저장소를 사용할 수 없음 | 간단한 설명 필드의 값이 "네트워크 저장소를 사용할 수 없습니다"와 같은 모든 기록입니다. |
| 모두 다음보다 큼 | [영향][ALL_GT][2 - 보통] | > | 영향>2 | 영향 필드의 값이 3인 모든 기록 - 낮음 |
| 모두 크거나 같음 | [영향][ALL_GTE][2 - 보통] | >= | 영향>=2 | 영향 필드의 값이 2 - 중간 또는 3 - 낮음인 모든 기록입니다. |
| 모두 보다 작음 | [재할당 횟수][ALL_LT][2] | < | reassignment_count<2 | 재할당 횟수 필드의 값이 2보다 작지만 같지 않은 숫자인 모든 기록입니다. |
| 모두 작거나 같음 | [재할당 횟수][ALL_LTE][2] | <= | reassignment_count<=2 | 재할당 횟수 필드의 값이 다음 중 하나인 모든 기록:
|
| 모두 같지 않음 | [영향][ALL_NEQ][1 - 높음] | != | impact!=1 | 영향 필드의 값이 1이 아닌 모든 기록 - 높음입니다. |
| 모두 비어 있지 않음 | [영향][ALL_NOTEMPTY] | ALL_NOTEMPTY | impactALL_NOTEMPTY | 영향 필드에 값이 있는 모든 기록입니다. |
| 모두 중 하나가 아님 | [영향][ALL_NOTONEOF][1 - 높음, 2 - 보통] | ALL_NOTONEOF | impactALL_NOTONEOF1,2 | 다음 값을 제외한 영향 필드가 무엇의 값으로 채워지는 모든 기록입니다.
|
| 다음 중 하나 모두 | [영향][ALL_ONEOF][1 - 높음, 2 - 보통] | ALL_ONEOF | impactALL_ONEOF1,2 | 영향 필드가 다음 값 중 하나로 채워진 모든 기록:
|
| 모든 비어 있음 | [간단한 설명][ANY_EMPTY] | ANY_EMPTY | short_descriptionANY_EMPTY | 간단한 설명 필드에 값이 없는 모든 기록입니다. |
| 모두 같음 | [간단한 설명][ANY_EQ][네트워크 저장소 사용할 수 없음] | ANY_EQ | short_description=네트워크 저장소를 사용할 수 없음 | 간단한 설명 필드의 값이 "네트워크 저장소를 사용할 수 없습니다"와 같은 모든 기록입니다. |
| 보다 큼 | [영향][ANY_GT][2 - 보통] | ANY_GT | impactANY_GT2 | 영향 필드의 값이 3 - 낮음인 모든 기록 |
| 크거나 같음 | [영향][ANY_GTE][2 - 보통] | ANY_GTE | impactANY_GTE2 | 영향 필드의 값이 2 - 중간 또는 3 - 낮음인 모든 기록입니다. |
| 보다 작음 | [재할당 횟수][ANY_LT][2] | ANY_LT | reassignment_countANY_LT2 | 재할당 횟수 필드의 값이 2보다 작거나 같지는 않은 숫자인 모든 기록입니다. |
| 작거나 같음 | [재할당 횟수][ANY_LTE][2] | ANY_LTE | reassignment_countANY_LTE2 | 재할당 횟수 필드의 값이 다음 중 하나인 모든 기록입니다.
|
| 같지 않음 | [영향][ANY_NEQ][1 - 높음] | ANY_NEQ | impactANY_NEQ1 | 영향 필드의 값이 1이 아닌 모든 기록 - 높음입니다. |
| 모두 비어 있지 않음 | [영향][ANY_NOTEMPTY] | ANY_NOTEMPTY | impactANY_NOTEMPTY | 영향 필드에 값이 있는 모든 기록입니다. |
| 다음 중 하나가 아님 | [영향][ANY_NOTONEOF][1 - 높음, 2 - 보통] | ANY_NOTONEOF | impactANY_NOTONEOF1,2 | 다음 값을 제외한 모든 항목으로 영향 필드가 채워진 모든 기록:
|
| 다음 중 하나 | [영향][ANY_ONEOF][1 - 높음, 2 - 보통] | ANY_ONEOF | impactANY_ONEOF1,2 | 영향 필드가 다음 값 중 하나로 채워진 모든 기록입니다.
|
| 코캣 | CONCAT(값) | 코캣 | CONCAT("환영합니다, ",@context.session.user.firstName) | 제공된 모든 문자열을 하나로 결합하는 새 문자열을 만듭니다. |
| 비어 있음 | EMPTY(값) | 비어 있음 | 비어 있음(@context.session.user.roles) | 값이 null이거나 정의되지 않은 경우 예를 반환합니다. |
| 만약에 | IF(if, then, else) | 만약에 | IF(@context.props.bare,"기본 페이지","기본 페이지가 아님") | 조건이 예일 경우 값을 반환합니다. 조건이 false이면 else 값을 반환합니다. |
| 렌 | LEN(목록) | 렌 | LEN([1,2,3]) | 배열의 항목 수를 반환합니다. |
| 선택 | PICK(배열, 필드) | 선택 | PICK(@context.session.user.preferences,"name") | 배열의 각 항목에 있는 필드에서 각 항목이 선택되는 새 배열을 작성합니다. 필드가 없으면 새 배열의 항목은 비어 있게 됩니다. |
| 범위 | 범위(시작, 종료) | 범위 | 범위(1,10) | 시작부터 시작하여 단계별로 증가하는 숫자 배열을 작성합니다. |
| 합계 | SUM(배열) | 합계 | 합계([1,2,3]) | 0에서 시작하여 배열에 있는 각 항목의 숫자 값을 더하고 결과 합계를 반환합니다. |
| 번역함 | 번역(텍스트) | 번역함 | 번역("복귀를 환영합니다") | 두 번째 인수에 지정된 문자가 세 번째 인수에 지정된 문자로 변환된 후 첫 번째 인수의 문자열을 반환합니다. |
| 비어 있는 위치 | [간단한 설명][WHERE_EMPTY] | WHERE_EMPTY | short_descriptionWHERE_EMPTY | 간단한 설명 필드에 값이 없는 기록을 추출합니다. |
| 같을 경우 | [간단한 설명][WHERE_EQ][네트워크 저장소 사용할 수 없음] | WHERE_EQ | short_descriptionWHERE_EQnetwork 저장소를 사용할 수 없음 | 간단한 설명 필드가 "네트워크 저장소를 사용할 수 없습니다"와 같은 기록을 추출합니다. |
| 보다 큰 위치 | [영향][WHERE_GT][2 - 보통] | WHERE_GT | impactWHERE_GT2 | 영향 필드 값이 3인 기록 추출 - 낮음 |
| 크거나 같은 경우 | [영향][WHERE_GTE][2 - 보통] | WHERE_GTE | impactWHERE_GTE2 | 영향 필드 값이 2 - 중간 또는 3 - 낮음인 기록을 추출합니다. |
| 여기서 다음보다 작음 | [재할당 횟수][WHERE_LT][2] | WHERE_LT | reassignment_countWHERE_LT2 | 재할당 횟수 필드의 값이 2보다 작지만 같지는 않은 숫자인 기록을 추출합니다. |
| 작거나 같은 위치 | [재할당 횟수][WHERE_LTE][2] | WHERE_LTE | reassignment_countWHERE_LTE2 | 재할당 횟수 필드의 값이 다음 중 하나인 기록을 추출합니다.
|
| 같지 않은 위치 | [영향][WHERE_NEQ][1 - 높음] | WHERE_NEQ | impactWHERE_NEQ1 | 영향 필드의 값이 1 - 높음이 아닌 기록을 추출합니다. |
| 비어 있지 않은 위치 | [영향][WHERE_NOTEMPTY] | WHERE_NOTEMPTY | impactWHERE_NOTEMPTY | 영향 필드에 값이 있는 기록을 추출합니다. |
| 다음 중 하나가 아닌 경우 | [영향][WHERE_NOTONEOF][1 - 높음, 2 - 보통] | WHERE_NOTONEOF | impactWHERE_NOTONEOF1,2 | 영향 필드가 다음 값을 제외한 값으로 채워지는 기록을 추출합니다.
|
| 어디 중 하나 | [영향][WHERE_ONEOF][1 - 높음, 2 - 보통] | WHERE_ONEOF | impactWHERE_ONEOF1,2 | 영향 필드가 다음 값 중 하나로 채워지는 기록을 추출합니다.
|