与全球反应组件交互

时间:2014-10-09 14:39:44

标签: javascript reactjs

我正在制作应用程序并希望在我点击应用程序中的各种链接时制作一个侧边栏。所以我开始创建一个包装器组件,只是将侧边栏和页面内容放在其下面,

SetupRailsPage = React.createClass

  render: ->
    div id: 'setup-rails-page',

      Sidebar()

      div className: 'container',
        div className: 'row',
          div className: 'col-xs-8 col-xs-offset-2',
            RailsBox(rails: @props.rails)

虽然感觉效率低下,但理想情况下我不想将其添加到每个页面中。我还没有看到任何有关此问题的反应代码,并想知道“反应方式”是什么。是处理这样的事情。

2 个答案:

答案 0 :(得分:0)

我怀疑ReactRouter可以在这里提供帮助。

如果您可以将您的应用程序分解为:

  • a'共同部分' (包含SideBar,也许还有其他东西)和
  • 每个'逻辑'的不同组件。页面;

那就是反应路由器claims要解决的问题。

编辑:OP真的想拥有一个"全球"事件通知系统,以避免传递许多回调,如here所述。

答案 1 :(得分:0)

您应该查看Flux模式(http://facebook.github.io/flux/docs/overview.html)。您的应用程序状态由数据存储处理,您可以通过创建操作来更改此状态。对商店的任何更改都会导致其发出更改后的内容。事件,导致感兴趣的组件重新呈现。您的侧边栏会生成操作,从而导致商店更改,从而导致应用的相关部分更新。 Fluxxor(http://fluxxor.com/)是一个非常有用的插件,可以帮助解决这种模式。