reactjs – 动态设置组件的道具

前端之家收集整理的这篇文章主要介绍了reactjs – 动态设置组件的道具前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我需要在组件存储在变量中之后设置它的道具,这里是伪代码
  1. render(){
  2.  
  3. let items = [{title:'hello'},{title:'world'}];
  4. let component = false;
  5.  
  6. switch (id) {
  7. case 1:
  8. component = <A />
  9. break;
  10. case 2:
  11. component = <B />
  12. break;
  13. }
  14.  
  15. return(
  16. items.map((item,index)=>{
  17. return(
  18. <span>
  19. {/* SOMETHING LIKE THIS WOULD BE COOL - IS THAT EVEN POSSIBLE*/}
  20. {component.props.set('title',item.title)}
  21. </span>11
  22.  
  23. )
  24. })
  25. )
  26. }

在内部返回我运行一个循环,我需要为存储在变量中的组件设置道具….如何设置我之前存储在变量中的组件的道具?

正确的方法是使用React的cloneElement方法( https://facebook.github.io/react/docs/react-api.html#cloneelement).
您可以通过以下方式实现您想要的目标:
  1. <span>
  2. {
  3. React.cloneElement(
  4. component,{title: item.title}
  5. )
  6. }
  7. </span>

猜你在找的React相关文章