Как создать функцию повторного использования в React

Question

Я совершенно новый, чтобы отреагировать так жаль, если это простой вопрос. У меня есть куча компонентов, и для каждого компонента я хотел бы указать начальное состояние для каждого из {b: this.constructor.displayName} («b» должно использоваться при построении имен классов). Вместо определения b в начальном состоянии «getInitialState» в каждом компоненте, я хотел бы определить некоторую функцию многократного использования, чтобы установить b всюду.

Из моих ранних исследований кажется, что миксины могут быть многообещающими. Тем не менее, я также читал, что миксины выходят из игры. Каков наилучший способ сделать это? Заранее спасибо!

Answer 1

Текущий способ сделать это в реактиве - использовать композицию, а не микшины. Состав также известен как «компонента высшего порядка» и выглядит как это:

class Foo extends React.Component { 
    render() { 
     return <div>{ this.props.b }</div>; 
    } 
} 

const EmbedClassName = function(Child) { 
    var b = Child.constructor.displayName; 
    return (props) => <Child {...props} b={b} />; 
}; 

var ComposedFoo = EmbedClassName(Foo);