不同文件组件的 state 和 props

Question

如果您的问题的答案很明显，我提前表示歉意，但我是 React 新手，无法在您的网站上找到答案。 我在同一文件夹的不同文件中有两个组件。我想获取组件 2 中组件 1 的状态，但它给了我一个错误。如何获取不同文件中组件的状态或属性？ 我如何知道哪个元素生成事件，例如，如果我有 7 个按钮，并且我想知道其中哪个元素生成事件，也来自不同文件的组件。 这些组件位于同一文件夹中： 地毯a1← 组件1.js componente2.js

代码如下：

//componente1.js
import React from 'react'
import Link from 'next/link'
import Image from 'next/image'
import cn1 from '../../public/lared.png'

class Componente1 extends React.Component{
   constructor(props){
     super(props);
     this.cambiarSenal = this.cambiarSenal.bind(this);
     this.state = {senal: ""};
   }

   cambiarSenal(event){
     let btn = event.target;        
     this.setState({
        senal: 'https://www.lared.cl/senal-online'
     });
   }

   render(){
     return( 
        <div className="root">
            <div className={styles.ctElm}>
                <div className={styles.ctImg} id="ctImg"><Image src= {cn1} alt='cn1' className={styles.img}/></div>
                   <p className={styles.ctTt} onClick={this.cambiarSenal}><Link href='/carpeta1/senalLive'><a className={styles.enl}>La Red</a></Link></p>
                </div> 
            </div>
        </div>
    });
}
export default Componente1;

//componente2.js
import React from 'react'    

class SenalLive extends React.Component{
   render(){
     return(
        
        <div className={styles.root}> 
           <div className={styles.cnl}>
               <iframe className={styles.frm} src={state.senal}></iframe>
           </div>
        </div>
   });
}
export return SenalLive;

总结一下。在 iframe 中，我将组件的状态称为 1。 我使用 state 是因为我要使用几个

，每个都会有更改使用 component2 的链接的事件，这将根据状态的变化更改 iframe 的 url