Question

如果我有一个带子节点的react组件，我在这些子节点上调用React.Children.toArray，为什么数组中的对象具有前面的键。$

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'));

这会将“。$ 1”记录到控制台。为什么密钥从1更改为。$ 1？

Answer 1

请参阅下面的说明https://facebook.github.io/react/docs/top-level-api.html#react.children.toarray

注意：在展平子项列表时，React.Children.toArray（）更改键以保留嵌套数组的语义。也就是说，toArray为返回数组中的每个键添加前缀，以便每个元素的键都限定为包含它的输入数组。

当孩子与React.Children.toArray一起使用时，为什么键会改变？

1 个答案: