组件之后子元素中的某个方法DidMount in parrent 元素



我使用react.js我有一个问题。我有两个组成部分:孩子和帕伦特。

import React, { Component, Children, cloneElement } from 'react'
import {render} from 'react-dom'
class Child extends Component {
    someMethod() {
        /* Some code... */
    }
    componentDidMount() {
        /* Some code... */
        console.log("Child component did mount!");
    }
    render() {
        return <span>Child</span>
    }
}
class Parent extends Component {
    componentDidMount() {
        /* Some code... */
        console.log("Parent component did mount!");
    }
    render() {
        let children = Children.map(this.props.children, (element, idx) => {
            return cloneElement(element, { ref: idx });
        });
        return (
            <div>
                {children}
            </div>
        )
    }
}
const demo = (
    <Parent>
        <Child></Child>
    </Parent>
);
render(demo,document.querySelector('#demo'));

我需要子元素(someMethod代码)中的方法,该方法将在 parrent 元素中运行componentDidMount后运行。谢谢。附言 React 和 ReactDom 版本是 0.14.8

我找到了解决方案。这不是很好,但它有效。我使用setTimeout(..., 0)在子元素中

componentDidMount() {
    setTimeout(()=>{
        /* Some code which will be run after componentDidMount in parent */
    },0);
}

最新更新