反应，将值从父级传递给两个不同的子级

Question

从父组件传递值。它适用于Nav组件，但不适用于TextComponent组件。嵌套的return和loop不允许传递值吗？

<div className="container">
            {                   
                currentpage.map((rows, i) => {
                    return (
                        <div key={i} className="row">               
                            <Nav editModeState={this.state.editModeState} /> //This editModeState is working fine.

                            {rows.row.map(function (component, i) { 

                                return <div className="col-lg-4">                                       
                                    <div key={i} className="card" key={i}>
                                      <div className="card-body">                                            
                                            <TextComponent
                                            componentFromParent = {component}
                                            editModeState={this.state.editModeState} //The value is not passing, but it is working for <Nav editModeState={this.state.editModeState} /> component
                                            />  
                                      </div>
                                    </div>      
                                </div>
                            })}
                        </div>
                    );
                })
            }
            </div>  

构造函数

constructor() {
  super();
  this.state = {
    editModeState: ""
  }
}
fromnaveditor(params) {
  this.setState({
    editModeState: params
  })
}

错误

TypeError：无法读取未定义的属性“状态”

Answer 1

此处具有函数绑定问题。 this is not bind properly to map function。
有两种方法可以解决此问题：

使用粗箭头语法（=>）

使用粗箭头功能（此处为currentpage.map((rows, i) => {的使用方式）来修复错误

{rows.row.map((component, i) => { /* Your code here */ })}

---

提供此功能以映射功能

map函数采用第二个参数this。因此，代码将修改为：

{rows.row.map(function(component, i) { /* Your code here */ }, this)}