[英]Using existing cljs components in a React project?
https://www.reddit.com/r/Clojure/comments/4el0xi/how_to_use_an_existing_reactjs_component_with/ https://www.reddit.com/r/Clojure/comments/4el0xi/how_to_use_an_existing_reactjs_component_with/
There is this existing post about using existing ReactJS components in a CLJS/Reagent project. 现有这篇关于在CLJS / Reagent项目中使用现有ReactJS组件的帖子。 I'm looking to do the opposite.
我正在寻找相反的事情。 I have a bunch of CLJS components and would like to compile them into a ui library of some sort so that they can be used by React developers.
我有一堆CLJS组件,并希望将它们编译成某种类型的ui库,以便React开发人员可以使用它们。 That is, if I have a button CLJS component, I would like to be able to render that Button using < Button /> or mylib.Button(_) etc.. in a React/js app file.
也就是说,如果我有一个按钮CLJS组件,我希望能够在React / js app文件中使用<Button />或mylib.Button(_)等来呈现该Button。
I have read this - https://shadow-cljs.github.io/docs/UsersGuide.html#target-node-library - extensively but it's not quite working out. 我已经阅读了这篇文章 - https://shadow-cljs.github.io/docs/UsersGuide.html#target-node-library-但是它还没有完成。 I've been using ":target :node-library" and I can get simple functions (that return strings/numbers, for example) to compile and work in my app, etc.. but it doesn't work for entire components.
我一直在使用“:target:node-library”,我可以得到简单的函数(例如返回字符串/数字)来编译和在我的应用程序中工作等等。但它不适用于整个组件。 For example, my cljs button component takes in :
例如,我的cljs按钮组件包含:
defn button [props & children]
but when I try to pass in these parameters (I call {lib.button({}, {})} in my App.js file), I get errors like "No protocol method IMap.-dissoc defined", because I'm trying to pass JS objects into CLJS-only functions, I believe. 但是当我尝试传递这些参数(我在我的App.js文件中调用{lib.button({},{})}时,我得到的错误就像“没有协议方法IMap.-dissoc defined”,因为我'我相信,我试图将JS对象传递给仅限CLJS的函数。 Not sure how to resolve this..
不知道如何解决这个问题..
I can explain more on this if it would help clarify. 如果它有助于澄清,我可以解释更多。 It would also be super helpful if anyone had a reference demo project or any resources they could link me to.
如果有人有参考演示项目或他们可以链接我的任何资源,这也将是非常有用的。
I only have a few suggestions: 我只有一些建议:
You can try to build a new sample project to consume your library with lein new figwheel myproject
and use JavaScript interop to move one step at a time closer to the native JS way of using your library. 您可以尝试使用
lein new figwheel myproject
构建一个新的示例项目来使用您的库,并使用JavaScript interop一次移动一步,更接近使用库的本机JS方式。
You can create an interface namespace that can consume JS objects and wrap these into Clojure data structures to sort out the protocol errors you're seeing, eg. 您可以创建一个可以使用JS对象的接口命名空间,并将它们包装到Clojure数据结构中,以便对您看到的协议错误进行排序,例如。 functions that take a
props
parameter and pass down (js->clj props)
to the rest of the code underneath. 带有
props
参数并向下传递(js->clj props)
到下面代码的其余部分的函数。
For the authoritative source, check the Reagent docs, especially this: http://reagent-project.github.io/docs/master/InteropWithReact.html#creating-react-components-from-reagent-components 对于权威来源,请检查Reagent文档,尤其是: http : //reagent-project.github.io/docs/master/InteropWithReact.html#creating-react-components-from-reagent-components
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.