If I have a react component with children and I call React.Children.toArray
on these children, why does the objects in the array have keys that are prepended with .$
var Child = React.createClass({
render: function() {
console.log(React.Children.toArray(this.props.children)[0].key);
return <div>{this.props.children}</div>
}
});
var Container = React.createClass({
render: function() {
return <Child><div key={1}>1</div></Child>
}
});
ReactDOM.render(<Container />, document.getElementById('container'));
This logs .$1
to the console. Why is the key changed from 1
to .$1
?