Реагировать ЯШ: Как установить подпорки в компонентах JSX, которые хранят в переменной

Question

Предположим, что я уже определяют компонент:

class Co extends React.Component { 
    render =() => { 
     const name = this.props.name; 
     return (
      <p>Hello, my name is {name}</p> 
     ) 
    } 
} 

и сохранить его в переменной:

const co = <Co />; 

Как я могу установить реквизит компонента с переменной? Будет co.props.set работы?

Answer 1

Как я понимаю, вы не хотите, чтобы сделать ваш компонент в синтаксисе JSX, но с вашей сохраненной переменной. Вы можете посмотреть на React.cloneElement. Это должно делать то, что вы хотите:

{React.cloneElement(co, {name: 'hans'})}

См: https://facebook.github.io/react/docs/top-level-api.html#react.cloneelement

Answer 2

Вы можете установить подпорки, как обычно

<Co name="Name"/> 

Если элемент является потомком какого-либо компонента, то вы можете использовать React.cloneElement()

class Parent extends React.Component { 
    render =() => { 
     const name = this.props.name; 
     return (
      <SomeComp><Co/></SomeComp> 
     ) 
    } 
} 
class SomeComp extends React.Component { 
    render =() => { 
     const name = this.props.name; 
     return (
      <SomeComp>{React.cloneElement(this.props.children, {name:"Name"})}</SomeComp> 
     ) 
    } 
}