reactjs、クラスレベルで小道具を渡す方法

Question

これは何をしようとしているのかの例です。 MyComponentを他のライブラリに渡しているので、<MyComponent hello={'Hello World'}/>を使わずにMyComponentクラスの小道具を渡したいと思います。

react-reduxはthis.props.stateを追加するためにどのように接続し、他の機能をコンポーネントの小道具にマッピングしますか？カスタムオブジェクトをコンポーネントに挿入したい

Answer 1

あなたはHigher Order Component

function withMyObject(WrappedComponent,helloText) { 
    return class extends React.Component { 

    render() { 
     return <WrappedComponent {...this.props} hello={helloText} />; 
    } 
    }; 
} 

使用法を作成する必要があります：あなたは、デフォルトの小道具を設定することができ

UpdatedComponent = withMyObject(ComponentToBeWrapped,"Hello"); 

Answer 2

を。私はその良い習慣だと思う。

import React, { Component } from 'react'; 

class MyComponent extends Component { 
    render() { 
    const { hello } = this.props; 
    return (
     <div>{hello}</div> 
    ); 
    }headerProp: "Header from props...", 
    contentProp:"Content from props..." 
} 

MyComponent.defaultProps = { 
    hello: 'Hello World!' 
} 

<MyComponent />