全部：
我对React Router还是很陌生，当我按照这个很棒的教程学习时，有一件我找不到的东西：
我如何调整布局以决定可以正确渲染窗口中的哪个区域，该教程中讨论的组件结构更像是内容的逻辑结构，但没有太多相关的UI布局/样式。
谁能给我展示一个简单的示例，说明如何将样式应用于相应的组件以确保它们放置在正确的位置？
谢谢
您的组件应该知道如何执行此操作。使用父级组件控制其子级的放置。例如，我用于应用程序的常见模式类似于：
var Nav = React.createClass({
render () {
return (
{'I am the Nav bar'}
);
}
});
var RightContent = React.createClass({
render () {
return (
{'I am Right Content'}
);
}
});
var LeftContent = React.createClass({
render () {
return (
{'I am Left Content'}
);
}
});
import {Col, Row} from 'react-bootstrap';
var Content = React.createClass({
render () {
return (
<Row>
<Col md={6}>
<LeftContent />
</Col>
<Col md={6}>
<RightContent />
</Col>
</Row>
);
}
});
var App = React.createClass({
render () {
return (
<div>
<Nav />
{this.props.children}
</div>
);
}
});
您可以在此处看到每个组件完全负责放置其子代。通常，良好的做法是让父组件进行布局，然后让子组件实际具有内容。
在每个组件的造型方面，您可以在组件层（讨论这是外界对这个问题的范围内）直接应用CSS，或者您也可以继续使用正常的全局CSS样式表-只是觉得每个组件作为div该页面上可能有也可能没有。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句