如何从React.js中的另一个类组件调用方法

  • Z时代
  • 2024-01-10
  • 分类：问答

因此，我必须对组件进行分类：

Class1：具有单击按钮

Class2：具有调用我的api的方法

基本上，我要调用的方法是设置和编辑另一个类中一个类内的状态。但是我一直失败。

回答：

Class1.js
export class Class1 extends Component {
   render() {
      return (
         <div onClick={must call Class2Method}></div>
      )
   }
}
Class2.js
export class Class2 extends Component {
   Class2Method(){
      Here I call my API, I set & call states, ...
   }
   render {
      return (
         <Class1 />
         Here I return my API content
      )    
   }   
}

回答：

  1. 我试图使用我的方法并在App.js（class2和class1的父级）中调用并设置状态。但后来我的Class2.js控制台说找不到我的状态。

  2. 我也尝试过：在我的Class 2中使用在Class1中使用。

回答：

干得好

Class1.js

       export class Class1 extends Component {
             render() {
                return (
                    <div onClick={this.props.callApi}></div>
                )
            }
       }

Class2.js

  1. 在构造函数中绑定callApi函数或将其更改为arrow函数。

  2. 将callApi方法传递给class1组件作为prop，并在上述组件中以this.props.callApi访问它，并将其传递给div的onClick。
     export class Class2 extends Component {
       callApi = () => {
           Here I call my API, I set & call states, ...
        }
       render {
           return (
              <Class1 callApi={this.callApi} />
                   Here I return my API content
            )    
       }

    }

以上是 如何从React.js中的另一个类组件调用方法 的全部内容， 来源链接： utcz.com/qa/430518.html

回到顶部