javascript - 状态未传递给子组件 reactjs

Question

我正在尝试将状态作为道具传递给另一个组件。子组件（页面上的一个按钮）没有收到任何道具。我做了一个console.log打印从父母收到的道具，但我得到一个空对象{}。我在这里做错了什么？

这是我的代码的摘录：

贷款.js（父）

<ForecloseBtn id={this.state.lead_id} foreclose={this.state.isForeclosed } test="xyz"/>

ForecloseBtn.js（儿童）

    import React from 'react';
    import { render } from 'react-dom';

    class ForecloseBtn extends React.Component {
        constructor(props) {
            super(props);
            console.log(this.props);
            this.state = {
                lead_id: this.props.id,
                isForeclosed: this.props.foreclose,
                sample: this.props.test
            };
        }

        render() {

            return (
                ......
            )
        }
    };


    const App = () => (


        <ForecloseBtn />

    );

    export default App;

标签： javascriptreactjsjsx

Answer 1

You can check my fiddle

将道具传递给孩子

希望这可以帮助。