react 动态添加组件属性_javascript – 如何在React中动态分配属性？

您正在重新实现现有的React.createElement方法.

您可以将组件的唯一道具存储在数组中,然后使用这些道具创建组件列表.

var propsList = [

{ id: 1, d: 'path', fill: 'none' },

{ id: 2, d: 'path', fill: 'none' },

{ id: 3, d: 'path', fill: 'none' }

];

var components = propsList.map(function(props) {

return React.createElement('g', props);

});

var App = React.createClass({

render: function() {

return React.createElement('div', null, components);

}

});

ReactDOM.render(

React.createElement(App, null),

document.getElementById('content')

);

如果您希望属性列表是动态的,那么您应该将其存储在组件的状态中.

var App = React.createClass({

getInitialState: function() {

return {

propsList: []

};

},

addProps: function(props) {

var propsList = this.state.propsList.concat([props]);

this.setState({ propsList: propsList });

},

render: function() {

var components = this.state.propsList.map(function(props) {

return React.createElement('g', props);

});

return React.createElement('div', null, components);

}

});