我是新手，所以如果我没有说清楚，我先道歉。我有一个基本的 react 应用程序和一个非常基本的 index.html 页面。代码如下所示:
<html>
<head>
<title></title>
</head>
<body>
<div id="root"></div>
<script src="bundle.js"></script>
</body>
</html>
我的 index.js 文件中的代码如下所示:
import React from 'react';
import { render } from 'react-dom';
import * as Redux from 'redux';
import { BrowserRouter as Router, Route } from "react-router-dom";
import { Home, Edit, Search, Github, Mine, About } from "./screens";
const Index = () => (
<Router>
<div>
<Route path="/" exact={true} component={Home} />
<Route path="/edit" component={Edit} />
<Route path="/search" component={Search} />
<Route path="/github" component={Github} />
<Route path="/mine" component={Mine} />
<Route path="/about" component={About} />
</div>
</Router>
);
render(<Index />, document.getElementById('root'));
我的 edit.js 中的代码如下所示:
import React from 'react';
import Header from '../components/Header';
const Edit = () => (
<Header title="Capture" />
);
export default Edit;
此代码将“Capture”发送回 header.js，header.js 在名为 title 的变量中接收“Capture”的值，该变量显示在标记中。
我想要做的是将 2 个值从 edit.js 传递到 header.js。我想继续在标题变量中发送“Capture”的值，但我还想在名为 description 的变量中传回值“This is the capture function”。如您所见，我在 header.js 代码中已经有了名为 description 的变量。它将放置在标签内。
如何修改 edit.js 中的代码以将 2 个值发送回 edit.js？
感谢您的帮助。
最佳答案
您可以将名为 description 的附加属性添加到您的 Header 组件，并在 Edit 组件中使用该新属性。
示例
//Edit.js
const Edit = () => (
<Header title="Capture" description="This is the capture function" />
);
//Header.js
const Header = (props) => (
<div>
<h1>{props.title}</h1>
<h2>{props.description}</h2>
</div>
);
关于javascript - 基本 react 多页应用程序更改标题内容，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/51584797/