2017-04-14 23 views
0

JSのクラスはまだ関数です。だから私の理解は、Wrapped1を作成すると、内部に暮らすのでAppに結びついているが、Wrapped1は独自のスコープを持っていることになるだろう。私はどこが間違っているのか分かりません。ReactのHigher Order Componentsでスコープはどのように定義されていますか?

let HigherOrderComp = (Component) => class extends React.Component{ 
    construstor(props){ 
    super(props); 
    this.state = { 
     count: 0 
    }; 
    } 

    componentDidMount(){ 
    setInterval(()=>{ 
     this.setState(
     count: this.state.count + 1 
    ); 
    }, 1000) 
    } 

    render(){ 
    return <Component {...this.props} {...this.state}> 
    } 
} 

    class Comp1 extends React.Component{ 
    render(){ 
     return(
     <div> 
      <p>Comp1</p> 
      {this.props.count} 
     </div> 
    ); 
    } 
    } 

let Wrapped1 = HigherOrderComp(Comp1); 

class App extends React.Component{ 
    constructor(props){ 
    super(props); 
    } 
    render(){ 
    return(
     <div> 
     <Wrapped1/> 
     </div> 
    ); 
    } 
} 

ReactDOM.render(<App/>, document.getElementById('app')); 

答えて

0

Wrapped1のインスタンスがApp内に作成するので、それはAppの知識を持っていません。 Wrapped1Appインスタンスにアクセスする必要がある場合は、必要なデータを小道具として渡す必要があります。

+0

ありがたいことに、内部コンポーネントが内部コンポーネントを認識していない、またはJavascriptから来ている一般的なReactアーキテクチャはそうですか? –

関連する問題