需要帮助构建 React 应用程序

Question

我是 designing/creating React 应用程序，但我需要一些帮助来构建整个应用程序。

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

现在，我有几个问题，关于如何构建它，以及哪些 React 插件或框架派上用场：

"filter" 栏是否应该是主布局的一部分 ("master page")？
我认为 react-router 是反应中路由的不错选择？
处理数据（显示和操作）时，Flux 是一件好事吗？或者 Flux 与数据无关？
我会从 ASP.Net WebAPI 检索我的数据。这是我通常使用 "plain" XmlHttpRequest / jquery ajax 做的事情吗？还是有更多的"React"方式？
额外：是否有使用 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 更好地了解 React 的工作原理...希望对您有所帮助

需要帮助构建 React 应用程序

Need help structuring React app

javascript

flux

reactjs

redux