react里面props到底是什么，怎么用。

最新推荐文章于 2025-10-07 01:47:54 发布

原创最新推荐文章于 2025-10-07 01:47:54 发布 · 3.7k 阅读

0 ·

CC 4.0 BY-SA版权

react 专栏收录该内容

8 篇文章

订阅专栏

本文介绍了React中props的概念，官方解释是React在遇到用户定义的组件元素时，会将JSX属性以一个对象的形式传递给该组件，这个对象被称为props。

概念

官网上是这么说的：

When React sees an element representing a user-defined component, it passes JSX attributes to this component as a single object. We call this object “props”.
意思是：当React看到表示用户定义组件的元素时，它会将JSX属性作为单个对象传递给此组件。我们称这个对象为“道具”。


function Welcome(props) {
  return <h1>Hello, {props.name}</h1>;
}//声明welcome组件，通过props.name使用传递过来的属性。
const element = <Welcome name="Sara" />;//使用welcome组件，将JSX属性作为单个对象传递给组件
ReactDOM.render(
  element,
  document.getElementById('root')
);