首页 > 解决方案 > 如何在其他组件发送 this.state 并在父组件中渲染

问题描述

我正在使用一个组件中的 api 来使用另一个名为 datagrid 的组件来呈现结果,如果我使用名为 datagrid 的组件中的 api 一切正常,但我的想法是只使用一次 api,问题不在于 api,问题是数据网格组件没有接收到 this.state 的新值。

class Color extends Component {

    state = {
        fields: {
            colorCodigo: null,
            colorNombre: '',
        }
    };

    componentDidMount() {

        //CONSUMO API.
        const params = this.props.match.params;

        if (!params.id) {
            return;
        }

        getDocument({
            documentId: params.id,
            fieldName: 'colorCodigo',
            moduleName: params.module
        }).then(document => {
            if (!document) {
                return;
            }
            this.setState({ fields: document });
        });

    }


    render() {


        return (


            <Paper elevation={5} className={this.props.classes.mainPaper}>
                <Datagrid datos={this.state.fields} />
            </Paper >


        );


    }


}


export default withStyles(styles)(Color);




class Datagrid extends Component {


    componentDidMount = () => {


        console.log("aqui entra en el render de Color y no muestra nada y 
      esta bien pero en el re - render de color cuando se actualiza el 
      estado no llega aqui para trabajar con la data que llega de la 
       api");



    console.log(this.props.datos);


    }

    render() {


        const { classes } = this.props;


        return (


            <Paper className={classes.root}>
                <Table className={classes.table}>
                    ......
        </Table>
            </Paper>


        );
    }
}
export default withStyles(styles)(Datagrid);

标签: reactjs

解决方案


推荐阅读