mirror of
https://github.com/facebook/react.git
synced 2025-11-01 09:12:30 +00:00
Merge pull request #4541 from marocchino/update-korean
Update Korean translation to e88c7bf
This commit is contained in:
@@ -118,6 +118,35 @@ var TodoList = React.createClass({
|
||||
>
|
||||
> `transitionAppear` prop은 버전 `0.13`에서 `ReactCSSTransitionGroup`에 추가되었습니다. 하위 호환성을 생각해서, 기본 값은 `false`로 설정되어 있습니다.
|
||||
|
||||
### 커스텀 클래스
|
||||
|
||||
트렌지션의 각 단계에서 커스텀 클래스 이름을 사용할 수도 있습니다. transitionName에 문자열을 넘기는 대신 `enter`, `leave` 같은 클래스 이름의 객체나 `enter`, `enter-active`, `leave-active`, `leave`같은 클래스 이름의 객체를 넘길 수 있습니다. enter, leave 클래스만 있다면, enter-active, leave-active 클래스는 클래스 이름 뒤에 '-active'를 붙여서 정할 수 있습니다. 커스텀 클래스를 사용한 예제입니다.
|
||||
|
||||
```javascript
|
||||
...
|
||||
<ReactCSSTransitionGroup
|
||||
transitionName={
|
||||
enter: 'enter',
|
||||
enterActive: 'enterActive',
|
||||
leave: 'leave',
|
||||
leaveActive: 'leaveActive',
|
||||
appear: 'appear',
|
||||
appearActive: 'appearActive'
|
||||
}>
|
||||
{item}
|
||||
</ReactCSSTransitionGroup>
|
||||
|
||||
<ReactCSSTransitionGroup
|
||||
transitionName={
|
||||
enter: 'enter',
|
||||
leave: 'leave',
|
||||
appear: 'appear'
|
||||
}>
|
||||
{item2}
|
||||
</ReactCSSTransitionGroup>
|
||||
...
|
||||
```
|
||||
|
||||
### 애니메이션 그룹이 작동하려면 마운트가 필요
|
||||
|
||||
자식들에게 트랜지션을 적용하려면 `ReactCSSTransitionGroup`은 이미 DOM에 마운트되어 있거나 prop `transitionAppear`가 `true`로 설정되어야만 합니다. 예를 들어, 밑의 코드는 동작하지 않을 것입니다. 왜냐하면 `ReactCSSTransitionGroup` 안에서 새 아이템을 마운트하는 대신 새 아이템과 같이 `ReactCSSTransitionGroup`를 마운트했기 때문입니다. 이 것을 위에 있는 [시작하기](#getting-stared) 항목과 비교해보세요.
|
||||
|
||||
@@ -86,8 +86,9 @@ ReactComponent render(
|
||||
|
||||
> 주의:
|
||||
>
|
||||
> `React.render()`는 넘어온 컨테이너 노드의 내용을 교체합니다.
|
||||
> 추후에 기존 자식들을 덮어쓰지 않고 이미 있는 DOM 노드에 컴포넌트를 삽입하는 것도 지원할 가능성이 있습니다.
|
||||
> `React.render()`는 넘어온 컨테이너 노드의 내용을 교체합니다. 안에 있는 DOM 엘리먼트는 첫 호출을 할 때 교체됩니다. 그 후의 호출에는 효율석으로 업데이트하기 위해 React의 DOM diff 알고리즘을 사용합니다.
|
||||
>
|
||||
> `React.render()`는 컨테이너 노드를 수정하지 않습니다. (컨테이너의 자식만 수정함) 추후에 기존 자식들을 덮어쓰지 않고 이미 있는 DOM 노드에 컴포넌트를 삽입하는 것도 지원할 가능성이 있습니다.
|
||||
|
||||
|
||||
### React.unmountComponentAtNode
|
||||
|
||||
@@ -21,7 +21,9 @@ number eventPhase
|
||||
boolean isTrusted
|
||||
DOMEvent nativeEvent
|
||||
void preventDefault()
|
||||
void isDefaultPrevented()
|
||||
void stopPropagation()
|
||||
void isPropagationStopped()
|
||||
DOMEventTarget target
|
||||
number timeStamp
|
||||
string type
|
||||
@@ -192,3 +194,11 @@ Number deltaX
|
||||
Number deltaY
|
||||
Number deltaZ
|
||||
```
|
||||
|
||||
### 미디어 이벤트
|
||||
|
||||
이벤트 이름:
|
||||
|
||||
```
|
||||
onAbort onCanPlay onCanPlayThrough onDurationChange onEmptied onEncrypted onEnded onError onLoadedData onLoadedMetadata onLoadStart onPause onPlay onPlaying onProgress onRateChange onSeeked onSeeking onStalled onSuspend onTimeUpdate onVolumeChange onWaiting
|
||||
```
|
||||
|
||||
@@ -20,6 +20,7 @@ React.render(<div style={divStyle}>Hello World!</div>, mountNode);
|
||||
|
||||
- `boxFlex`
|
||||
- `boxFlexGroup`
|
||||
- `boxOrdinalGroup`
|
||||
- `columnCount`
|
||||
- `fillOpacity`
|
||||
- `flex`
|
||||
@@ -27,6 +28,7 @@ React.render(<div style={divStyle}>Hello World!</div>, mountNode);
|
||||
- `flexPositive`
|
||||
- `flexShrink`
|
||||
- `flexNegative`
|
||||
- `flexOrder`
|
||||
- `fontWeight`
|
||||
- `lineClamp`
|
||||
- `lineHeight`
|
||||
|
||||
Reference in New Issue
Block a user