Tepki - çocuk bileşenleri için sınıf ekleme

Question

Reaksiyonu kullanıyorum ve basitçe çocukları işlemek ve duruma göre bir sınıf eklemeniz gereken bir bileşenim var. Bunu yapmanın en iyi yolu nedir? Sen çocuğa aşağı bir aksesuar geçebilir

var childClasses = [], 
    childClassNames; 
if (condition) { 
    childClasses.push('my-class-name'); 
} 
childClassNames = childClasses.join(' '); 

return (<div className={childClassNames}> 
    .... (your component here) 
</div>); 

Answer 1

bir hafta önce anladım, bu başka ne olabilir istedik:

export default class ContainerComponent extends React.Component { 
    constructor(props) { 
     super(props); 

     this.modifyChildren = this.modifyChildren.bind(this); 
    } 

    modifyChildren(child) { 
     const className = classNames(
      child.props.className, 
      {...otherClassses} 
     ); 

     const props = { 
      className 
     }; 

     return React.cloneElement(child, props); 
    } 
    render() { 
     return (<div> 
      {React.Children.map(this.props.children, this.modifyChildren(child))} 
     </div>); 
    } 
} 

Answer 2

İçinde senin bileşeni yöntemini işlemek

çocuğunuzla olarak

işlemek:

const classes = []; 

if (props.contentVisible) 
    classes.push('visible'); 

<div className={classes.join(' ')} /> 

Answer 3

ve uygulamak ne sınıf seçebilir (ya da sadece sınıf adını geçmesine ama bu daha semantik olduğunu):