reactjs - 試薬から事前定義された反応コンポーネントを使用しますか?

Question

反応コンポーネントを抽象化した外部 UI があり、それらを試薬から再利用したいのですが、clojurescript からデータを渡すだけで、定義済みの反応コンポーネントを直接レンダリングする方法はありますか? 私はclojurescriptの初心者です。

Answer 1

やってみよう！まず、コンポーネントを 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")))

アトムを使用してプレーン js に変換することCommentBoxにより、小道具をプレーン js オブジェクトとして両方に渡していることに注意してください。見逃したものがある場合は、 gistで残りを見つけることができます。#jsclj->js