Translate 10.5-clone-with-props.md to Japanese
Kohei TAKATA committed
Jul 22, 2015 at 16:12 UTC
2a81f1229af9d4b4b5b444f88325bd8279471682
1 file changed
+34
docs/docs/10.5-clone-with-props.ja-JP.md
new
+34
@@ -0,0 +1,34 @@
1
+---
2
+id: clone-with-props
3
+title: ReactElementsをクローンすること
4
+permalink: clone-with-props-ja-JP.html
5
+prev: test-utils-ja-JP.html
6
+next: create-fragment-ja-JP.html
7
+---
8
+
9
+> 注意:
10
+> `cloneWithProps` は使用不可になりました。[React.cloneElement](top-level-api-ja-JP.html#react.cloneelement)を代わりに使用してください。
11
+
12
+元のReact要素とは異なるプロパティを持った要素のコピーを作成したいと考える稀なケースがあるかと思います。1つの例としては、以下のように、 `this.props.children` に渡すように要素をクローンし、異なるプロパティを持つようそれらをレンダリングするものです。
13
+
14
+```js
15
+var _makeBlue = function(element) {
16
+ return React.addons.cloneWithProps(element, {style: {color: 'blue'}});
17
+};
18
+
19
+var Blue = React.createClass({
20
+ render: function() {
21
+ var blueChildren = React.Children.map(this.props.children, _makeBlue);
22
+ return <div>{blueChildren}</div>;
23
+ }
24
+});
25
+
26
+React.render(
27
+ <Blue>
28
+ <p>This text is blue.</p>
29
+ </Blue>,
30
+ document.getElementById('container')
31
+);
32
+```
33
+
34
+`cloneWithProps` は `key` や `ref` をクローンされた要素に渡すことはありません。 `className` や `style` は自動的にマージされます。
\ No newline at end of file