多个组件传递方法
来源:5-9 Redux 知识点复习补充
暴躁的排骨汤
2022-09-03
BaseComp为公用基础组件
ChildComp为业务组件
都是ParentComp 的子组件
有什么方法能在ChildComp监听 BaseComp组件onClick派发出的事件
class ParentComp extends Component {
// ...
render() {
return <>
<BaseComp selectedItem={(item)=>{selectedItem(item)}}/>
<ChildComp {// todo}/>
</>
}
// selectedItem(item) { }
// ...
}
class BaseComp extends Component {
constructor(props) {
super(props)
this.selectedItem = this.selectedItem.bind(this)
}
selectedItem(item) {
//this.props.selectedItem(item)
}
render() {
const list = this.props.list
return <div className="list">
<ul>
<li key={item.id} onClick={() => { this.selectedItem(item) }}>{item.name}<li>
</ul>
</div>
}
}
class ChildComp extends Component {
render() {
return <div>
</div>
}
}
写回答
1回答
-
Dell
2022-09-12
ParentComp 传一个方法给 BaseComp,BaseComp 点击时,调用这个方法。在这个方法里,ParentComp 可以改变自己的数据,这个数据又传递给 ChildComp,通过数据的变动,让 ChildComp执行逻辑即可。
00
相似问题