Javascript React JS-如何将不同的道具传递到其他道具的地图中
问题:如何将此Javascript React JS-如何将不同的道具传递到其他道具的地图中,javascript,arrays,reactjs,components,Javascript,Arrays,Reactjs,Components,问题:如何将此参数数组传递到映射了数据数组的组件中? 我的州有两个数组this.state={data:[],params:[]}
参数
数组传递到映射了数据
数组的
组件中?
我的州有两个数组this.state={data:[],params:[]}我通过道具将它们传递到一个名为PostList.js的文件中。它在映射函数中呈现每个帖子(来自数据数组),如下所示:
//PostList.js
//.....Removed for brevity....
render(){
// Tried let params = this.props.params; HERE
let socialPostNodes = this.props.data.map(socialPost => {
// Tried let params = this.props.params; HERE
return (
<Post
//I need params = { this.props.params } HERE
messageNumber = { socialPost.message.indexOf('', 1) }
message={ socialPost.message}
uniqueID={ socialPost['_id'] }
key={ socialPost['_id'] } >
{ socialPost.message }
</Post>
)
});
//.....removed for brevity......
当您输入map
时,此范围将丢失!但是map
函数允许您提供第二个参数来提供此
上下文
例如:
传入第二个参数将允许您访问父作用域的this
,这意味着this.props.params
现在将具有值。当您输入map
时,此作用域将丢失!但是map
函数允许您提供第二个参数来提供此
上下文
例如:
传入第二个参数将允许您访问父作用域的this
,这意味着this.props.params
现在将具有值。@kevin danikowski我想我们已经弄糊涂了。您能给我看一下传递this.state.data
和this.state.params
的部分吗?它应该在您的父组件中,该组件正在导入从Postlist.js导出的组件。
@keshavDulal-gravityplanx能够解决它,我这样传递它:。。。是 啊确切地这就是我想确定的。“不管怎样,”凯文·达尼科夫斯基说,“我想我们被搞糊涂了。您能给我看一下传递this.state.data
和this.state.params
的部分吗?它应该在您的父组件中,该组件正在导入从Postlist.js导出的组件。
@keshavDulal-gravityplanx能够解决它,我这样传递它:。。。是 啊确切地这就是我想确定的。无论如何。
class Post extends Component {
loadInParams() {
let socialMessage = this.props.message;
if (socialMessage.indexOf("{{company}}") >= 0) {
let newSocialMessage = socialMessage.replace("{{company}}", 'company')
return newSocialMessage
} else {
let newSocialMessage = socialMessage;
return newSocialMessage
}
}
render() {
return (
<div>
<h4> Post { this.props.messageNumber } </h4>
<strong>Post Template: </strong> { this.props.message }
<br />
<strong>Ready Post: </strong>
{ this.loadInParams() }
</div>
)
}
}
this.props.data.map(socialPost => {
...
}, this);