我们试试吧！我们可以从在 js 文件中编写组件开始。

var CommentBox = React.createClass({displayName: 'CommentBox',
  render: function() {
    return (
      React.createElement('div', {className: "commentBox"},
                          this.props.comment
      )
    );
  }
});

然后我们可以直接从 Reagent 中调用它：

(defonce app-state
  (atom {:text "Hello world!"
         :plain {:comment "and I can take props from the atom"}}))

(defn comment-box []
  js/CommentBox)

(defn hello-world []
  [:div
   [:h1 (:text @app-state)]
   [comment-box #js {:comment "I'm a plain React component"}]
   [comment-box (clj->js (:plain @app-state))]])

(reagent/render-component [hello-world]
                          (. js/document (getElementById "app")))

请注意，我们CommentBox通过使用#js原子并将原子转换为纯 js将 props作为纯 js 对象传递给两者clj->js。如果我遗漏了某些内容，您可以在gist 中找到其余内容。