訪問React類組件的返回變量

Question

我有反應成分，它返回一個整數。 類組件的結構如下：

class MyClass extends Component {
   constructor(props) {
        super(props);
        this.state = {
            variable : 0
        }
    }
    componentDidMount(){
       // do some works
       this.setSate({variable:$someValue});
    }
    render(){
        var temp = this.state.variable;
        return temp;
    }
}

我需要在渲染中的React的另一個類組件中獲取MyClass返回的值。 如果我打來

render () {
  return (
    <div>{Myclass}</div>
  );
}

它工作正常。 有什么方法可以調用此外部返回，並將值分配給變量？

Answer 1

嘗試改用“ this.props”。 你可以這樣傳遞

   class MyClass extends Component {
   constructor(props) {
        super(props);
        this.state = {
            variable : 0
        }
    }
    componentDidMount(){
       // do some works
       this.setSate({variable:$someValue});
    }
    render(){
        const {variable} = this.state
        return (
             <MyOtherClass variable = {variable}/>
         );
    }
}

在MyOtherClass中：

render() {
    const {variable} = this.props
    return (
        <div>{variable}</div>
    );
}

Answer 2

您應該能夠擴展MyClass並調用super.render()

class MyOtherClass extends MyClass {

    render() {
        const value = super.render();
        return (
            <div>{value}</div>
        );
    }
}

編輯 ： codeandbox.io中的工作示例