reactjs - Design Pattern Help: How to render dynamic views from a single controller component? -
i current have component holds business logic, depending on page, i'd render different views. i'm having trouble since i'm not sure how elegantly pass functions , props of control component view component.
right now, solution is:
<controller viewcomponent={viewcomponent} />
and rendering inside controller:
<this.props.viewcomponent function1={this.func} function2={this.func2} />
it works, it's confusing , i'm not elegant solution. there's solution cloning, seems hack too.
does have insight how solve this?
why not do:
<controller> <viewcomponent ... /> </controller>
and in controller's render function:
<div> {this.props.children} </div>
update: if want pass parents functions , state/props children use react.children.map func.
renderchildren = () => { react.children.map(this.props.children, (c) => { <c.type {...this.props} {...c.props} somefunction={this.somefunction} /> } } <div> { this.renderchildren() } </div>
Comments
Post a Comment