Question

我非常陌生，因此如果我不清楚自己的意思，我会事先道歉。我有一个非常基本的index.html页面的基本react应用程序。代码如下：

<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。我想继续在title变量中发送“ Capture”的值，但我也想在名为description的变量中传递值“ This is the capture function”。如您所见，header.js代码中已经有一个名为description的变量。它将被放置在标签内。

如何修改edit.js中的代码以将2个值发送回edit.js？

谢谢您的帮助。

Answer 1

您可以在b组件中添加一个名为description的附加道具，并在Header组件中使用该新道具。

示例

Edit

基本的反应多页面应用程序更改标题内容

1 个答案: