2016-07-08 20 views
5

私たちはすでにKnockoutJSを広く使用しているアプリケーションを持っています。 Chartingでは、ReactJSを使用する予定です。 ReactJSを使って簡単なチャートを簡単に作成することができました。パズルの質問の1つ私は、どのように私はこのリアクションチャートと非リアクトワールドから対話できますか?例を挙げましょう。あなたが棒グラフのReactコンポーネントを持っていて、まず軸を使ってグラフをレンダリングしたいので、以下のようにしたいとしましょう。反応しない世界からの反応成分との相互作用

ReactDOM.render(<BarChart axes={true} data={data} {...lot of other props} />, mountNode); 

ここでは、リアクション以外の世界に存在するボタンをクリックし、軸を非表示にするボタンをクリックしたとします。どうやってやるの?外部から呼び出せるBarChartコンポーネントのパブリックメソッドを公開することはできますか? EXのために

。、

const BarChart = React.createClass({ 

    .... 

    showAxes(show) { 
    //... 
    } 
}); 

var barChart = ReactDOM.render(<BarChart axes={true} data={data} {...lot of other props} />, mountNode); 
barChart.showAxes(false); 

しかし、軸が小道具ではない状態であるので、でも私たちは小道具権利を変更することはできませんパブリックメソッドを公開?私たちはこれらのことをどのように扱うことができるでしょうか?私たちが反応していない世界からどのように反応するのか?

答えて

8

あなたは関数を公開するだけで、外部から関数を呼び出すことができます。 getinitialStateに状態の軸を格納することができます

const BarChart = React.createClass({ 
    getInitialState(){ 
    return { 
     axes: this.props.axes 
    } 
    } 
    .... 

    showAxes(show) { 
    //... 
    this.setState({ 
     axis: show 
    }) 
    } 
}); 

var barChart = ReactDOM.render(<BarChart axes={true} data={data} {...lot of other props} />, mountNode); 
barChart.showAxes(false); 
関連する問題