Reactjs 将组件之间的数据传递到React（props）

进入

显示访问组件
我已显示数据：

<div>
{(this.state.allVisit.length > 0) ? this.state.allVisit.map(data => {

    return (
        <div key={data.id} className="card-header mb-2" style={{ background: "#F0F3F7" }}>
            <div className="form-group">
                <label><b>VisitName:</b> {data.dataContext.VisitName} &nbsp;</label>
             </div>                                                     
                                                    
            <div className="form-group">
                <Link to={`/visit/${data.id}`} className="btn btn-secondary btn-sm" >
                    <i className="fas fa-arrow-circle-right" /> Details
                </Link>
            </div>
        </div>
    )
    }) : (
        <div className="card-header p-3 mb-2 text-black">
            <label><b>Empty</b></label>
        </div>
     )
}

</div>

然后我想访问
id
和
数据。dataContext
：

class VisitDetails extends Component {

    render() {

        const { id } = this.props;
        const { data.dataContext } = this.props;
        //or const {data} = this.prop

        return (
            <div>
                {id}, {data.dataContext.VisitName}
            </div>
        )
    }
}

类VisitDetails扩展组件{
render（）{
const{id}=this.props；
const{data.dataContext}=this.props；
//或const{data}=this.prop
返回(
{id}，{data.dataContext.VisitName}
)
}
}

但我做错了什么。我正在学习并尝试开发第一个应用程序。
在您的DetailVisite组件中：

<Link to={{ pathname: `/visit/${data.id}`, state: { data: data.dataContext.VisitName} }} className="btn btn-secondary btn-sm">
   <i className="fas fa-arrow-circle-right" /> Details
</Link>


细节

在VisitDetails.js中：

class VisitDetails extends Component {

    render() {

        const { id } = this.props.match.params;
        const { data } = this.props.location.state;

        return (
            <div>
                {id}, {data}
            </div>
        )
    }
}

类VisitDetails扩展组件{
render（）{
const{id}=this.props.match.params；
const{data}=this.props.location.state；
返回(
{id}，{data}
)
}
}
我编辑了我的答案，请尝试并告诉我是否有错误SID很好，但数据否：
无法分解“this.props.location.state”的属性“data”，因为它未定义。
你复制粘贴了我上次的编辑？我必须重新启动，现在可以了。但是可以传递我的所有
data.dataContext
？是的，您只需将此
状态：{data:data.dataContext}}}
class VisitDetails extends Component {

    render() {

        const { id } = this.props.match.params;
        const { data } = this.props.location.state;

        return (
            <div>
                {id}, {data}
            </div>
        )
    }
}