时间戳

首页 > 解决方案 > 使用其他对象将道具传递给子组件

reactjs - 使用其他对象将道具传递给子组件

问题描述

function NavigationItem(props){                   
return( 
<TouchableOpacity 
onPress={(view)=>props.navigation.closeDrawer()}>     
<Text style={customStyle.headerStyle}>{props.titleValue}</Text>
<View style={customStyle.dividerStyle}  />
  </TouchableOpacity>
  ) 
}

在上面的函数中，你可以看到我在单参数 props 和其他传递下面的对象中接收数据。但我不知道它为什么起作用我传递了两个值，一个是 props，另一个是下面给出的语法中的 object titlevalue。我希望你能理解我的查询我是反应原生的新手。

<NavigationItem {...props} titleValue={"Profile"} ></NavigationItem>

标签： reactjsreact-native

解决方案

使用组件：

首先，您必须了解什么是 react native 中的 props 以及如何将它们传递给其他组件。

<NavigationItem {...props} titleValue={"Profile"} ></NavigationItem>

因此，在您的声明中{...props}，并且title是道具，您所做的是将所有现有道具( as {...props})+title传递给其他一些组件。

定义组件：

因此，传递给您的组件进行创建的任何道具都将在内部语句中接收为props

function NavigationItem(props)

注意事项

不要混淆道具名称作为参数，function NavigationItem(props)您可以在这里使用任何名称kamal。但是在使用后kamal你必须访问你传递的道具，比如kamal.title.

还有一件事，它不是将整个道具传递{...props}给其他组件的好方法。re-render如果里面有什么变化，它会的{...props}。

推荐阅读