gpt4 book ai didi

javascript - 需要帮助构建 React 应用程序

转载 作者:行者123 更新时间:2023-12-03 06:02:43 25 4
gpt4 key购买 nike

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

我想要创建的应用程序构建如下: enter image description here

现在,我有几个关于如何构建它的问题,以及哪些 react 插件或框架可以派上用场:

  1. “过滤器”栏应该成为主布局(“母版页”)的一部分吗?
  2. 我假设react-router在 React 中路由是一个不错的选择吗?
  3. 处理数据(显示和操作)时,是 Flux一起工作有好处吗?或者 Flux 与数据无关?
  4. 我将从 ASP.Net WebAPI 检索数据。这是我通常用“普通”XmlHttpRequest/jquery ajax 做的事情吗?或者有更多“React”方式吗?

  5. 额外:使用 Redux 是否有特定原因?我真的不明白它的用途:)

预先感谢您的帮助。

最佳答案

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

<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 是顶部组件,是传递 Prop 的主要容器,例如在您将拥有的 render() 中传递 Prop

// 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 上的 child } 将呈现为 <Layout />组件。

建议您阅读这篇文章:https://facebook.github.io/react/docs/thinking-in-react.html更好地理解 react 是如何工作的......希望它有帮助

关于javascript - 需要帮助构建 React 应用程序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39687374/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com