구성요소 추가 및 구성
페이지에서 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 - 높음] | != | 영향!=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,"베어 페이지","베어 페이지가 아님") | 조건이 참이면 다음 값을 반환합니다. 조건이 거짓이면 다른 값을 반환합니다. |
| 렌 | LEN(목록) | 렌 | 렌([1,2,3]) | 배열의 항목 수를 반환합니다. |
| 수취 | PICK(배열, 필드) | 수취 | PICK(@context.session.user.preferences,"name") | 배열에 있는 각 항목의 필드에서 각 항목이 선택되는 새 배열을 만듭니다. 필드가 없으면 새 배열의 항목이 비어 있습니다. |
| 범위 | 범위(시작, 종료) | 범위 | 범위(1,10) | 시작부터 시작하여 단계별로 증가하는 숫자 배열을 생성합니다. |
| 합계 | SUM(배열) | 합계 | 합계([1,2,3]) | 0에서 시작하여 배열에 있는 각 항목의 숫자 값을 더하고 결과 합계를 반환합니다. |
| 번역 | 번역(텍스트) | 번역 | TRANSLATE("복귀를 환영합니다") | 두 번째 인수에 지정된 문자가 세 번째 인수에 지정된 문자로 변환된 후 첫 번째 인수의 문자열을 반환합니다. |
| 비어 있는 위치 | [간단한 설명][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 | 영향도 필드가 다음 값 중 하나로 채워진 기록을 추출합니다.
|