Merge pull request #3734 from marocchino/update-korean

Update Translation to 0183f70
This commit is contained in:
Paul O’Shannessy 2015-04-23 23:03:47 -07:00
commit 4dbccea975
7 changed files with 44 additions and 30 deletions

View File

@ -31,7 +31,7 @@ UI를 가지고 할 수 있는 가장 기초적인 것은 데이터를 표시하
</html>
```
문서의 나머지에서, 코드가 위와 같은 HTML 템플릿에 들어갔다고 가정하고 JavaScript 코드에만 집중할 것입니다. 위의 주석 부분을 다음과 같은 JavaScript 코드로 바꿔 보세요:
문서의 나머지에서, 코드가 위와 같은 HTML 템플릿에 들어갔다고 가정하고 JavaScript 코드에만 집중할 것입니다. 위의 주석 부분을 다음과 같은 JSX 코드로 바꿔 보세요:
```javascript
var HelloWorld = React.createClass({

View File

@ -11,13 +11,13 @@ React에서는 컴포넌트를 감싸서 추상화하는 것이 일반적인 패
[JSX 스프레드 어트리뷰트](/react/docs/jsx-spread-ko-KR.html)를 통해 props에 추가적인 값을 병합할 수 있습니다.
```javascript
return <Component {...this.props} more="values" />;
<Component {...this.props} more="values" />
```
만약 JSX를 사용하지 않는다면 ES6의 `Object.assign`나 Underscore의 `_.extend` 같은 객체 헬퍼를 사용할 수 있습니다:
```javascript
return Component(Object.assign({}, this.props, { more: 'values' }));
React.createElement(Component, Object.assign({}, this.props, { more: 'values' }));
```
이 튜토리얼의 나머지 부분은 모범 답안을 소개할 것입니다. JSX와 실험적인 ES7 구문을 사용합니다.

View File

@ -6,18 +6,29 @@ prev: test-utils-ko-KR.html
next: create-fragment-ko-KR.html
---
드문 경우긴 하지만 엘리먼트에서 소유하지 않은 엘리먼트의 props를 변경하고 싶을 때가 있습니다 (`this.props.children`로 전달된 엘리먼트의 `className` 변경 같은 경우). 아니면 전달된 엘리먼트의 복사본 여러 개를 만들고 싶을 수도 있습니다. 이는 `cloneWithProps()`로 할 수 있습니다.
#### `ReactElement React.addons.cloneWithProps(ReactElement element, object? extraProps)`
`element`를 얕게 복사하고 `extraProps`로 넘긴 props를 머지합니다. `className``style` props는 지능적인 방법으로 머지됩니다.
> 주의:
>
> `cloneWithProps``key`를 클론된 엘리먼트에 전달하지 않습니다. 키를 보존하고 싶으시면, `extraProps` 객체에 넣으세요.
>
> ```js
> var clonedElement = cloneWithProps(originalElement, { key : originalElement.key });
> ```
>
> 비슷하게 `ref`도 유지되지 않습니다.
> `cloneWithProps`는 비추천입니다. 대신 [React.cloneElement](top-level-api.html#react.cloneelement)를 사용하세요.
드문 경우긴 하지만 원래 엘리먼트와 다른 prop을 가진 React 엘리먼트의 복사본을 만들고 싶을 때가 있습니다. 예를 들면 `this.props.children`에 클론한 엘리먼트를 넘기고 다른 prop으로 렌더링하는 경우 입니다.
```js
var _makeBlue = function(element) {
return React.addons.cloneWithProps(element, {style: {color: 'blue'}});
};
var Blue = React.createClass({
render: function() {
var blueChildren = React.Children.map(this.props.children, _makeBlue);
return <div>{blueChildren}</div>;
}
});
React.render(
<Blue>
<p>This text is blue.</p>
</Blue>,
document.getElementById('container')
);
```
`cloneWithProps``key``ref`를 클론된 엘리먼트에 전달하지 않습니다. `className`, `style` prop은 자동으로 머지됩니다.

View File

@ -53,23 +53,24 @@ React는 모든 `data-*`, `aria-*` 어트리뷰트와 밑에 있는 모든 어
```
accept acceptCharset accessKey action allowFullScreen allowTransparency alt
async autoComplete autoFocus autoPlay cellPadding cellSpacing charSet checked classID
className cols colSpan content contentEditable contextMenu controls coords
crossOrigin data dateTime defer dir disabled download draggable encType form
formAction formEncType formMethod formNoValidate formTarget frameBorder height
hidden href hrefLang htmlFor httpEquiv icon id label lang list loop manifest
marginHeight marginWidth max maxLength media mediaGroup method min multiple
muted name noValidate open pattern placeholder poster preload radioGroup
readOnly rel required role rows rowSpan sandbox scope scoped scrolling seamless
selected shape size sizes span spellCheck src srcDoc srcSet start step style
tabIndex target title type useMap value width wmode
async autoComplete autoFocus autoPlay cellPadding cellSpacing charSet checked
classID className colSpan cols content contentEditable contextMenu controls
coords crossOrigin data dateTime defer dir disabled download draggable encType
form formAction formEncType formMethod formNoValidate formTarget frameBorder
headers height hidden high href hrefLang htmlFor httpEquiv icon id label lang
list loop low manifest marginHeight marginWidth max maxLength media mediaGroup
method min multiple muted name noValidate open optimum pattern placeholder
poster preload radioGroup readOnly rel required role rowSpan rows sandbox scope
scoped scrolling seamless selected shape size sizes span spellCheck src srcDoc
srcSet start step style tabIndex target title type useMap value width wmode
```
덧붙여, 이런 비표준 어트리뷰트도 지원됩니다.
- 모바일 사파리를 위한 `autoCapitalize autoCorrect`.
- [오픈 그래프](http://ogp.me/) 메타 태그를 위한 `property`.
- [HTML5 마이크로데이터](http://schema.org/docs/gs.html)를 위한 `itemProp itemScope itemType itemRef itemId`.
- [HTML5 마이크로데이터](http://schema.org/docs/gs.html)를 위한 `itemProp itemScope itemType itemRef itemID`.
- 인터넷 익스플로어를 위한 `unselectable`.
컴포넌트에 직접 HTML 문자열을 넣을 때 사용하는, React 전용 어트리뷰트 `dangerouslySetInnerHTML`([자세한 정보는 여기](/react/docs/special-non-dom-attributes-ko-KR.html))도 있습니다.

View File

@ -88,6 +88,8 @@ React.render(
);
```
네이티브 HTML 엘리먼트 이름은 소문자로 시작하고 커스텀 React 클래스 이름은 대문자로 시작합니다.
#### JSX 문법
JavsScript 안의 유사 XML 구문이 먼저 눈에 띌 것입니다. 우리에겐 이를 JavaScript로 변환해주는 간단한 프리컴파일러(precompiler)가 있습니다.

View File

@ -25,4 +25,4 @@ var App = React.createClass({
React.render(<App></App>, mountNode);
```
괜찮은 예제들을 더 알아보려면, [프론트 페이지](/)의 마지막 예제를 참고하세요.
서브 컴포넌트(`span`)에 억세스하려면, [refs](/react/docs/more-about-refs.html)를 넣으세요.

View File

@ -21,4 +21,4 @@ function createMarkup() { return {__html: 'First &middot; Second'}; };
이 기능성은 주로 DOM 문자열을 다루는 라이브러리와 협동하기 위한 목적으로 제공하며, 포함할 HTML은 잘 정제되어야 합니다. (예: XML 검증을 통과)
더 완벽한 사용 예제를 보려면 [대문](/)의 최신 예제를 참조하세요.
더 완벽한 사용 예제를 보려면 [대문](/react/)의 최신 예제를 참조하세요.