React 中的 prop 参数从何而来？答案

【问题标题】：Where does prop argument come from in React?React 中的 prop 参数从何而来？
【发布时间】：2019-06-08 06:13:48
【问题描述】：

在 react 中，你可以声明一个函数或类组件，并使用里面的 prop 对象来使你的代码更可重用。但是我似乎无法弄清楚 prop 参数本身的来源。

function Welcome(props) {
  return <h1>Hello, {props.name}</h1>;
}

或

 class Welcome extends React.Component {
render() {
 return <h1>Hello, {this.props.name}</h1>;
 }
}

然后你可以像这样创建实例：

<Welcome name="Larry" />
<Welcome name="Tim" />

在这两个示例中，我似乎无法理解 props 对象的来源。

【问题讨论】：

标签： reactjs

【解决方案1】：

您的困惑来自于您正在查看 JSX（而不是纯 javascript）这一事实。这个 JSX 被编译成纯 Javascript，然后执行的是这样的：

React.createElement(Welcome, {name: 'Larry'}, null)

您可以在此示例中看到Welcome 是您的组件，作为第二个参数传递给createElement 函数的对象是props。

您可以在 React 网站 (React without JSX) 上阅读更多相关信息

【讨论】：