反応クラスの関数を別々のファイルに保存する

Question

反応クラスの関数を別々のファイルに保存し、使用するためにそれらの関数をインポートする方法はありますか？これを行う必要がある理由は、純粋に私のコンポーネントのサイズを減らし、カテゴリ別に機能をグループ化するためです。例えば

：

import functionIWantToImport from '../functions/functionIWantToImport'; 
import anotherFunction from '../functions/anotherFunction'; 

Class Test extends React.Component { 
    constructor(props){ 
     super(props); 

     this.state = {}; 
    } 

    //and then include the functions like below: 
    functionIWantToImport; 
    anotherFunction; 
} 

私は私がコンポーネントクラスの一部をアレントヘルパー関数でこれを行うことができます知っています。しかし、スペースを節約し、コードを整理するために、私のコンポーネント関数を使ってやりたいと思います。

Answer 1

使用する標準JSの機能（関数を矢印ではない）、およびコンストラクタでインスタンスに機能をバインド：もちろん

function externalMethod() { // simulates imported function 
 
    return this.state.example; 
 
} 
 

 
class Test extends React.Component { 
 
    constructor(props){ 
 
     super(props); 
 

 
     this.state = { example: 'example' }; 
 
     
 
     this.externalMethod = externalMethod.bind(this); 
 
    } 
 

 
    render() {  
 
    return (
 
     <div>{ this.externalMethod() }</div> 
 
    ); 
 
    } 
 
} 
 

 
ReactDOM.render(
 
    <Test />, 
 
    test 
 
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> 
 
<div id="test"></div>