I'm using Navbar as the root file and I have 3 pages(profile, About, and Home), I want to get data from pages to the root file, e.g. (title = "Profile"), because I want to display the title in the navbar.

my navbar page is listed below

import React from "react";

function app(){
return(
<div className="topnav">
          <a
            style={{
              fontWeight: "bold",
              fontSize: "20px",
              position: "absolute",
              margin: "10px",
              color: "#001b2b",
            }}
          >
            {title}
          </a>
<Link exact to="/profile">profile</Link>
<Link exact to="/home">Home</Link>
<Link exact to="/about">About</Link>

</div>
)}

if I click profile I want to set the title="profile"

I stuck to get data from child component

推荐答案

Since its just a title, rather than sending values from child to parent, you can just set a session variable PageTitle when you are clicking on any of the menu on navigation bar and refresh the state. If you are in Profile page the set session variable as below

import { ReactSession }  from 'react-client-session';
ReactSession.set("PageTitle", "Profile");

and in your root file you can get this session variable as below,

this.title = ReactSession.get("PageTitle");  // This will Return "Profile"

Reactjs相关问答推荐

警告:您在没有 `onChange` 处理程序的情况下为表单字段提供了 `value` 属性

React.js 中的页面崩溃(读取未定义的属性)

react-redux 中 redux store 的非相关部分更新时组件重新渲染

推送数组数据来渲染视图?

Suspense React 无法获取数据

如何使用带有 onChange 函数 REACT 的 useCallback 钩子

ReactJS useState hook:我可以使用状态变量本身更新对象数组吗?

Axios:获取两个请求 OPTIONS & POST

Media媒体查询语法

在 React 中处理 Axios 错误

如何在react中处理自定义挂钩的依赖项数组

React-Redux 中的调度函数

使用带参数的重新 Select Select 器

使用 ReactJS 突出显示文本

React Native:本机props RCTView.maxHeight 没有 propType

错误:yarn start - error Command "start" not found

React 0.13 this.getDOMNode() 等价于 React.findDOMNode()

使用 styled-components 传递 props

this.setState 未定义

从material ui 处理自动完成组件的更改