React反応ホットローダーを使用したときの最大呼び出しスタックサイズを超えました

Question

react-hot-loaderを使用すると、私に奇妙な問題が発生します。

のみ、この場合は Uncaught RangeError: Maximum call stack size exceeded at PatientEdit.__test__REACT_HOT_LOADER__

class PatientEdit extends React.Component { 
    test =() => { 
     return 123 
    } 
    constructor(props) { 
     super(props) 
    } 
    static propTypes = { 
    } 
    render() { 
     return (
      <div>{this.test()}</div>) 
    } 
} 

がスローされます。しかし以下の3がドキュメントとして追跡されたすべての権利

// A 
class PatientEdit extends React.Component { 
    test(){ 
     return 123 
    } 
    constructor(props) { 
     super(props) 
    } 
    static propTypes = {} 
    render() { 
     return (
      <div>{this.test()}</div>) 
    } 
} 
// B 
class PatientEdit extends React.Component { 
    test(){ 
     return 123 
    } 
    constructor(props) { 
     super(props) 
    } 
    static propTypes = {} 

    render() { 
     return (
      <div>{this.test()}</div>) 
    } 
} 
// C 
class PatientEdit extends React.Component { 
    test =() => { 
     return 123 
    } 
    static propTypes = {} 
    render() { 
     return (
      <div>{this.test()}</div>) 
    } 
} 

ローダー構成されていると言う：.babelrcは以下のように、ファイルの前babel-polyfillとreact-hot-loader/patchを追加エントリ

// .babelrc 
    { 
     "presets": [["env", {"modules": false}], "react", "stage-1"], 
     "plugins": [ 
      "react-hot-loader/babel", 
      "transform-decorators-legacy", 
      "transform-flow-strip-types", 
      "transform-object-assign", 
      "transform-runtime", 
      "typecheck", 
      "react-css-modules" 
     ] 
    } 

最初は奇妙な振る舞いに衝撃を受け、エラースタックを無視しました。今度はreact-hot-loaderのメカニズムと歓迎詳細な説明を見て私の時間

Answer 1

本当の推論よりも多くの推測。 （答えを通して聞くのが大好きです）

矢印機能は、ランタイムコンテキストに自動的にバインドされます。 （この場合、PatientEditクラスインスタンス、コンポーネント）。

コンストラクタがまだ実行されていないため、クラスインスタンスが作成されていないという問題があると思います。しかし、インスタンスはバインドされる必要があります。これにより、おそらくクラスコードが（コンストラクタを見つけることを期待して）再び実行されます。これが最終的にコールスタックのオーバーフローを引き起こすループの原因です。