我有一个名为Content.js的组件,它从父级接收道具然后映射路由,如何将道具传递给孩子?
App.js
render() {
const title = [{"id":0, "tit":"Home", "path":"/"}, {"id":1, "tit":"Works", "path":"/works"}, {"id":2, "tit":"About", "path":"/about"}];
return (
<div>
<Menu title={title}/>
<Content title={title}/>
</div>
);
}
Content.js
render() {
const routeComponents = this.props.title.map(({path, tit}, key) => <Route exact path={path} component={Page} tit={tit} key={key} />);
return (
<Switch>
{routeComponents}
</Switch>
);
}
Page.js
render()
{
return (
<div>
<h1>Hello {this.props.tit}</h1>
</div>
)
}
我的道具未定义。