反应：传递道具不起作用。我错过了什么？

Question

正如您可能从标题中了解到的那样，在 React 中传递道具是行不通的。我不明白为什么。

主要 Ap 组件

import './App.css';
import Licence from './Licence';

function App() {
  return (
    <>
    <Licence>
      test={"Test123"}
    </Licence>
    </>
  );
}
export default App;

其他组件

import React from 'react';


const Licence = (props) => {
    return (
    <div>
        <h1>name : {props.test}</h1>
    </div>
    )
}

export default Licence;

问题如果我启动脚本并呈现页面，则不会显示任何内容。我做错了什么？

Answer 1

更新您的应用程序组件：

```
<Licence
  test={"Test123"} />
```

Answer 2

我觉得许可证组件不错！

您只需更改您在 App 上的设置方式即可。需要在标签上传递道具，像这样：


import './App.css';
import Licence from './Licence';

function App() {
  return (
    <>
    <Licence test={"Test123"} />
    </>
  );
}
export default App;

Answer 3

这样传

<Licence test={"Test123"} />

并像这样访问

const Licence = (props) => {
    return (
    <div>
        <h1>name : {props.test}</h1>
    </div>
    )
}

另一种方式

<Licence>
     Test123
 </Licence>

这样访问

const Licence = (props) => {
    return (
    <div>
        <h1>name : {props.children}</h1>
    </div>
    )
}

反应：传递道具不起作用。我错过了什么？

React: Passing Props not working. What am I missing?

javascript

dataflow

reactjs