CodeEditor/JsonEditor
- 1 Component Type
- 1.1 1. CodeEditor
- 1.2 2. JsonEditor
- 2 Function
- 2.1 1. Width/Height
- 2.2 2. Light/Dark Mode
- 2.3 3. Language
Component Type
사용자가 여러 줄의 Code를 직접 입력 할 수 있도록 코드 입력 영역을 제공하는 컴포넌트로는 CodeEditor
와 JsonEditor
2가지가 있다. ( 참고: Input Component | Common options )
1. CodeEditor
CodeEditor의 기본 UI는 다음과 같다.
2. JsonEditor
JsonEditor는 자주 사용하는 json
언어의 CodeEditor를 별도의 컴포넌트로 만들어 제공하는 것으로 기본 UI와 옵션 기능은 CodeEditor와 동일하다.
Function
1. Width/Height
CodeEditor 입력창의 가로와 세로 길이를 직접 입력하여 설정 할 수 있다. 예를 들어 Height=200px
로 설정하면 다음과 같이 입력 필드의 세로 길이만 증가한다.
2. Light/Dark Mode
CodeEditor를 Light Mode와 Dark Mode로 선택하여 사용 할 수 있다.
3. Language
CodeEditor 컴포넌트 내에서 사용 가능한 Language는 다음과 같다.
→ css
, html
, java
, javascript
, json
, less
, mysql
, scss
, typescript
, xml