react.dev/docs/10.5-clone-with-props.zh-CN.md

---
id: clone-with-props-zh-CN
title: 克隆 ReactElements
permalink: docs/clone-with-props-zh-CN.html
prev: test-utils-zh-CN.html
next: create-fragment-zh-CN.html
---

> 注意:
> `cloneWithProps` 被弃用了. 用 [React.cloneElement](top-level-api.html#react.cloneelement) 代替.

在很罕见的情况下，你可能需要创建一个 React 元素的拷贝，它与初始的元素有不同的 props。一个例子是克隆这些传递到 `this.props.children` 的元素并用不同的 props 渲染他们。

```js
var cloneWithProps = require('react-addons-clone-with-props');

var _makeBlue = function(element) {
  return cloneWithProps(element, {style: {color: 'blue'}});
};

var Blue = React.createClass({
  render: function() {
    var blueChildren = React.Children.map(this.props.children, _makeBlue);
    return <div>{blueChildren}</div>;
  }
});

ReactDOM.render(
  <Blue>
    <p>This text is blue.</p>
  </Blue>,
  document.getElementById('container')
);
```

`cloneWithProps` 不传递 `key` 或者 `ref` 到被克隆的元素。`className` 和 `style` props 被自动合并。