mirror of
https://github.com/reactjs/react.dev.git
synced 2026-02-27 03:08:06 +00:00
Update content
- Up to 5ab7fde
This commit is contained in:
@@ -99,11 +99,12 @@ JSX를 사용하기 시작하기 위한 가장 쉬운 방법은 브라우저에
|
||||
|
||||
## JSX 없이 React 사용하기
|
||||
|
||||
JSX는 완전히 선택적입니다. 당신은 React와 JSX를 함께 사용하지 않아도 상관없습니다. 당신은 이 트리들을 `React.createElement` 를 통해 만들 수 있습니다. 첫번째 인자는 태그 이름이며, 두번째 인자에 속성 오브젝트를 전달하고 세번째 인자로는 자식 엘리먼트를 전달하면 됩니다.
|
||||
JSX는 완전히 선택적입니다. 당신은 React와 JSX를 함께 사용하지 않아도 상관없습니다. 그냥 JavaScript에서 React 엘리먼트를 `React.createElement`로 만들 수 있습니다. 여기에 태그 이름이나 컴포넌트, 속성 오브젝트, 자식 엘리먼트들을 전달하면 됩니다.
|
||||
|
||||
```javascript
|
||||
var child = React.createElement('li', null, 'Text Content');
|
||||
var root = React.createElement('ul', { className: 'my-list' }, child);
|
||||
var child1 = React.createElement('li', null, 'First Text Content');
|
||||
var child2 = React.createElement('li', null, 'Second Text Content');
|
||||
var root = React.createElement('ul', { className: 'my-list' }, child1, child2);
|
||||
React.render(root, document.body);
|
||||
```
|
||||
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
---
|
||||
id: jsx-in-depth-ko-KR
|
||||
title: JSX 깊이보기
|
||||
permalink: jsx-in-depth.ko-KR.html
|
||||
prev: displaying-data.ko-KR.html
|
||||
next: jsx-spread.ko-KR.html
|
||||
permalink: jsx-in-depth-ko-KR.html
|
||||
prev: displaying-data-ko-KR.html
|
||||
next: jsx-spread-ko-KR.html
|
||||
---
|
||||
|
||||
[JSX](http://facebook.github.io/jsx/)는 XML과 비슷한 JavaScript문법 확장입니다. React에서 변환되는 간단한 JSX 구문을 사용하실 수 있습니다.
|
||||
@@ -88,9 +88,10 @@ JSX를 사용 하시려면, [시작하기](/react/docs/getting-started.html) 가
|
||||
|
||||
## 네임스페이스를 사용한 컴포넌트
|
||||
|
||||
자식을 많이 가지는 컴포넌트를 만들거나, 재사용 가능한 컴포넌트 카테고리(`Form` 카테고리처럼)가 있는 애플리케이션을 만든다면, 간단하고 쉽게 하기 위해, *컴포넌트에서 네임스페이스*를 사용할 수 있습니다. 예를 들어, 이렇게 해야 할 일이 있다면
|
||||
폼같은 자식을 많이 가지는 컴포넌트를 만든다면, 많은 변수 선언을 하게 될 것입니다.
|
||||
|
||||
```javascript
|
||||
// 변수 선언의 어색한 블록
|
||||
var Form = MyFormComponent;
|
||||
var FormRow = Form.Row;
|
||||
var FormLabel = Form.Label;
|
||||
@@ -106,7 +107,7 @@ var App = (
|
||||
);
|
||||
```
|
||||
|
||||
위에 변수를 한 묶음 선언하는 대신에, 다른 컴포넌트를 어트리뷰트로 가지는 하나의 컴포넌트만 쓸 수 있습니다.
|
||||
더 간단하고 쉽게 *네임스페이스를 사용한 컴포넌트*를 사용해서, 다른 컴포넌트를 어트리뷰트로 가지는 하나의 컴포넌트만 쓸 수 있습니다.
|
||||
|
||||
```javascript
|
||||
var Form = MyFormComponent;
|
||||
|
||||
Reference in New Issue
Block a user