使用试剂中的预定义反应成分?

piy*_*vra 10 clojurescript reactjs om reagent

我有一些带有反应组件抽象的外部UI,我想从试剂中重用它们,有没有办法直接渲染预定义的反应组件,只需从clojurescript传递数据.我是一个clojurescript初学者.

sbe*_*nsu 17

我们试试吧!我们可以从js文件中编写组件开始.

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

然后我们可以直接从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")))
Run Code Online (Sandbox Code Playgroud)

请注意,我们CommentBox通过使用#js和通过将atom转换为plain js 将props传递给两者作为普通js对象clj->js.如果我错过了什么,你可以在要点中找到其余部分.