將道具添加到React渲染調用與循環構造

說我有一個數組（「道具」），我想渲染一個React組件。就像：將道具添加到React渲染調用與循環構造

const props = []; 

ReactDOM.render(<Comp prop0={props[0]} prop1={props[1]/>, document.getElementById('foo'));

是否有可以接受的方式使用一些循環結構而不是「硬編碼」它將道具添加到React組件？

來源

2016-03-14 Alexander Mills

通常情況下，你可以使用傳播運營商有：

var props = {}; 
props.foo = 'something'; 
props.bar = 'something else'; 

ReactDOM.render(<Component {...props} />, someDomElement);

來源

2016-03-14 10:13:28 poke

沒錯。可以添加此鏈接以供參考：https：//facebook.github.io/react/docs/transferring-props.html – ArneHugo

感謝您的回答！你知道如何做同樣的事情，但有多個孩子以及多個道具？ –

我想，如果你想兩者呈現數量可變的患兒道具的數量可變的，你可以做到這一點，像這樣：

const React = require('react'); 


module.exports = function(children){ 

    return React.createClass({ 

     renderChildren: function(){ 

      return children.map(function(Child){ 

        return (
         <div> 
          <Child {...Child.propz}/> 
         </div> 
       ) 
      }); 

     }, 

     render: function(){ 

      return (

       <html lang="en"> 
       <head> 
        <meta charset="UTF-8"></meta> 
        <title>Title</title> 
       </head> 
       <body> 

       <div> 
        {this.renderChildren()} 
       </div> 

       </body> 
       </html> 

      ) 

     } 

    }); 
};

來源

2016-03-30 22:31:27

將道具添加到React渲染調用與循環構造

回答

相關問題