react-redux child1 trigger child2 container methode

Question

Ich versuche triger child method von einem anderen Kind. mit ihrer übergeordneten Komponente.

ich weiß, wenn ich mit redux arbeite, muss ich Felder auf dem Speicher ändern und das die Komponenten wird durch die benötigten Stützen neu gerendert. aber in diesem Fall muss ich nichts speichern, nur um die erste Kind-Methode bei jedem Drücken auszuführen.

import React from 'react'; 
import Child1Container from "./Child1Container"; 
import Child2Container from "./Child1Container"; 

export default class Parentextends React.Component { 
    constructor(props){ 
    super(props); 

    } 

    RunChild1Method(){ 
    // Run Child1 Method 
    } 

    render() { 
    return (
      <div> 
       <Child1Container /> 
       <Child2Container RunChild1Method={this.RunChild1Method} /> 
      <div> 
      ) 
    } 
} 

Chiled2 Container

import { connect } from 'react-redux'; 
import Child2Component from "./Child2Component"; 

const mapStateToProps = (state, ownProps) => { 

    return { 
      RunChild1Method: ownProps.RunChild1Method 
    }; 
}; 

const Child2Container = connect(mapStateToProps)(Child2Component); 

export default Child2Container ; 

Child2 Komponente

import React from 'react'; 

export default class Child2Component extends React.Component { 
    constructor(props){ 
    super(props); 
    } 

    render() { 
    return (
     <button onclick={() => {this.props.RunChild1Method()}}> Click Me!</ button> 

    ) 
    } 
} 

Answer 1

diese Verwendung Refs zu erreichen: https://reactjs.org/docs/refs-and-the-dom.html

export default class Parent extends React.Component { 
    RunChild1Method(){ 
    if (!this.child1Ref) return; 
    this.child1Ref.runMethod(); 
    } 

    render() { 
    return (
     <div> 
     <Child1Container ref={(comp) => { this.child1Ref = comp; }} /> 
     <Child2Container RunChild1Method={this.RunChild1Method} /> 
     <div> 
    ) 
    } 
} 

Allerdings (Meine Meinung) Ich würde dringend empfehlen nicht Ihre Anwendungen so strukturieren. Komponenten sollten eine Verkapselung von Funktionalität sein, und dies ist ein Anti-Pattern, das zukünftige Kopfschmerzen verursachen wird.