New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Translated "render-props.md" #120
Conversation
Deploy preview for de-reactjs ready! Built with commit c42eb32 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hui! This took a little bit of time. I've reviewed your translation. Please take a look at it.
@@ -42,22 +41,22 @@ class MouseTracker extends React.Component { | |||
render() { | |||
return ( | |||
<div style={{ height: '100%' }} onMouseMove={this.handleMouseMove}> | |||
<h1>Move the mouse around!</h1> | |||
<p>The current mouse position is ({this.state.x}, {this.state.y})</p> | |||
<h1>Bewege die Maus!</h1> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
<h1>Bewege die Maus!</h1> | |
<h1>Bewege die Maus umher!</h1> |
@@ -87,19 +86,19 @@ class MouseTracker extends React.Component { | |||
render() { | |||
return ( | |||
<div> | |||
<h1>Move the mouse around!</h1> | |||
<h1>Bewege die Maus!</h1> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
<h1>Bewege die Maus!</h1> | |
<h1>Bewege die Maus umher!</h1> |
@@ -145,17 +143,18 @@ class MouseTracker extends React.Component { | |||
render() { | |||
return ( | |||
<div> | |||
<h1>Move the mouse around!</h1> | |||
<h1>Bewege die Maus!</h1> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
<h1>Bewege die Maus!</h1> | |
<h1>Bewege die Maus umher!</h1> |
@@ -199,7 +198,7 @@ class MouseTracker extends React.Component { | |||
render() { | |||
return ( | |||
<div> | |||
<h1>Move the mouse around!</h1> | |||
<h1>Bewege die Maus!</h1> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
<h1>Bewege die Maus!</h1> | |
<h1>Bewege die Maus umher!</h1> |
} | ||
|
||
class MouseTracker extends React.Component { | ||
render() { | ||
return ( | ||
<div> | ||
<h1>Move the mouse around!</h1> | ||
<h1>Bewege die Maus!</h1> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
<h1>Bewege die Maus!</h1> | |
<h1>Bewege die Maus umher!</h1> |
|
||
{/* | ||
This is bad! The value of the `render` prop will | ||
be different on each render. | ||
Nicht gut! Der Wert des `render` Prop wird |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nicht gut! Der Wert des `render` Prop wird | |
Nicht gut! Der Wert des `render`-Prop wird |
This is bad! The value of the `render` prop will | ||
be different on each render. | ||
Nicht gut! Der Wert des `render` Prop wird | ||
bei jedem rendern verändert. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
bei jedem rendern verändert. | |
bei jedem Rendern verändert. |
@@ -299,27 +298,27 @@ class MouseTracker extends React.Component { | |||
} | |||
``` | |||
|
|||
In this example, each time `<MouseTracker>` renders, it generates a new function as the value of the `<Mouse render>` prop, thus negating the effect of `<Mouse>` extending `React.PureComponent` in the first place! | |||
In diesem Beispiel wird jedes Mal, wenn `<MouseTracker>` rendert, eine neue Funktion mit dem Wert vom `<Mouse render>` Prop generiert, wodurch der Effekt von der `<Mouse>` erweiterten `React.PureComponent` negiert wird! |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
In diesem Beispiel wird jedes Mal, wenn `<MouseTracker>` rendert, eine neue Funktion mit dem Wert vom `<Mouse render>` Prop generiert, wodurch der Effekt von der `<Mouse>` erweiterten `React.PureComponent` negiert wird! | |
In diesem Beispiel wird jedes Mal, wenn `<MouseTracker>` rendert, eine neue Funktion mit dem Wert vom `<Mouse render>`-Prop generiert, wodurch der Effekt von der `<Mouse>` erweiterten `React.PureComponent` zunichte gemacht wird! |
|
||
To get around this problem, you can sometimes define the prop as an instance method, like so: | ||
Um dieses Problem zu umgehen, können Sie manchmal das Prop als eine Instanz-Methode definieren, in etwa so: |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Um dieses Problem zu umgehen, können Sie manchmal das Prop als eine Instanz-Methode definieren, in etwa so: | |
Um dieses Problem zu umgehen, kannst du manchmal das Prop als eine Instanz-Methode definieren, in etwa so: |
<Mouse render={this.renderTheCat} /> | ||
</div> | ||
); | ||
} | ||
} | ||
``` | ||
|
||
In cases where you cannot define the prop statically (e.g. because you need to close over the component's props and/or state) `<Mouse>` should extend `React.Component` instead. | ||
In Fällen, in denen Sie das Prop nicht statisch definieren können (bspw., weil Sie es über den Props der Komponenten und/oder dem Zustand schließen müssen), sollte `<Mouse>` den `React.Component` stattdessen erweiten. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
In Fällen, in denen Sie das Prop nicht statisch definieren können (bspw., weil Sie es über den Props der Komponenten und/oder dem Zustand schließen müssen), sollte `<Mouse>` den `React.Component` stattdessen erweiten. | |
In Fällen, in denen du das Prop nicht statisch definieren kannst (bspw., weil du es über die Props der Komponenten und/oder dem State schließen musst), sollte `<Mouse>` den `React.Component` stattdessen erweitern. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hui! This took a little bit of time. I've reviewed your translation. Please take a look at it.
Moved to #144, because of inactivity |
No description provided.