需要帮助构建React应用程序

Question

我正在React中设计/创建一个应用程序，但我需要一些帮助来构建整个事物。

我想要创建的应用程序构建如下：

现在，我有几个关于如何构建它的问题，以及插件或框架的反应是否派上用场：

1. 应该＆＃34;过滤＆＃34; bar是主要布局的一部分（＆＃34;母版页＆＃34;）？
2. 我认为react-router是做出反应路由的好选择吗？
3. 使用数据（显示和操作）时，Flux是一件好事吗？或者Flux与数据无关？

4. 我从ASP.Net WebAPI中检索我的数据。这是我通常使用＆＃34; plain＆＃34; XmlHttpRequest / jquery ajax？或者还有更多＆＃34; React＆＃34; -way？

5. 额外：是否有使用 Redux 的特定原因？我真的不明白使用它：）

提前感谢您的帮助。

Answer 1

我想你可以有这样的布局：

<App>
    <Navbar /> { /* Here you show the username also, this view will depend on props */ }
    <Layout /> { /* Here you may have the content and the sidenav */ }
</App>

App是顶级组件，主要容器传递道具，例如你将拥有的render（）

// You should treat this as a Page component, the one that grabs
// data and passes it as props to another components
export default class AppPage extends React.Component {
    render() {
        return (<AppLayout { ...this.props } />);
    }
}

export default class AppLayout extends React.Component {
    render() {
        return (
            <Navbar someProp={ this.props.someProp } />
            { this.props.children }
        );
    }
}

路由器可以是例如：

<Router history={ browserHistory }>
  <Route path="/" component={ App }>
    <IndexRoute component={ Landing } />
    <Route path="/index" component={ Layout } />
  </Route>
</Router>

IndexRoute是'/'，你可以说哪些组件应该在哪条路线上使用，例如你路由到/ layout {this.props。 AppLayout上的children}将呈现为<Layout />组件。

我建议你阅读这篇文章：https://facebook.github.io/react/docs/thinking-in-react.html 更好地理解反应是如何起作用的......希望它有所帮助