使用 CoffeeScript 嵌套 React 组件答案

【问题标题】：Nested React Components with CoffeeScript使用 CoffeeScript 嵌套 React 组件
【发布时间】：2015-09-25 13:39:24
【问题描述】：

为了使用常规 JSX 在 react 中嵌套组件，我看到了以下 sn-p：

render: function() {
  return (
    <div>
      <span>Options:</span>
      <Copmonent.Comment.List />
      <Copmonent.Comment.Form />
    </div>
  );

使用React.DOM（和coffeescript）的等价物是什么？

render: ->
  React.DOM.div {},
    React.DOM.span {}, "Options:"
    ???
    ???

【问题讨论】：

标签： coffeescript reactjs

【解决方案1】：

我会从组件创建工厂：

List = React.createFactory(ListClass)
Form = React.createFactory(FormClass)

然后，我们可以在任何我们想要的地方直接调用它们：

render: ->
  React.DOM.div {},
    React.DOM.span {}, "Options:"
    Component.Comment.List {}
    Component.Comment.Form {}

【讨论】：

【解决方案2】：

我正在使用https://github.com/jsdf/coffee-react 进行转换。

使用这个 lib 渲染看起来类似于普通的 .JSX

render: () ->
  <div className="some-class">
    <SomeComponent />
  </div>

【讨论】：