reactjs - 如何在 2 个组件之间传递参数并在“componentWillMount()”中使用它 - 我正在使用 react-navigation

Question

这是我需要的一个例子

// This view should receive the parameter before render()
componentWillMount(){
    fetch(parameterHere)
}

这张图片只是上面代码的图片。 图片

Answer 1

通过将其作为道具从父级传递给子级，在父子组件之间传递值。

class ComponentA extends React.Component {
    render() {
        <ComponentB mProp={someValue}/>
    }
}

class ComponentB extends React.Component {
    componentWillMount() {
        fetch(this.props.mProp);
    }

    render() {
        ...
    }
}

通过将该道具提升到共享的父组件并在父组件中管理该道具的值，在两个孩子之间传递值

class ParentComponent extends React.Component {
    onChangeMProp = (newValue) => {
        this.setState({ someValue: newValue });
    }

    render() {
        const { someValue } = this.state;

        return (
            <div>
                <ComponentA 
                    onChangeMProp={this.onChangeMProp} 
                    mProp={someValue}
                />
                <ComponentB 
                    onChangeMProp={this.onChangeMProp} 
                    mProp={someValue}
                />
            </div>
        )
    }
}