我正在尝试在我的新ClojureScript和react-beautiful-dnd应用程序中使用Reagent。根据博客here,它表示我需要在:foreign-libs
文件中使用project.clj
包含该文件。
我已将其配置如下
:cljsbuild
{:builds {:min
{:source-paths ["src/cljs" "src/cljc" "env/prod/cljs"]
:compiler
{:output-to "target/cljsbuild/public/js/app.js"
:output-dir "target/cljsbuild/public/js"
:source-map "target/cljsbuild/public/js/app.js.map"
:optimizations :advanced
:foreign-libs [{:file "src/cljs/react-beautiful-dnd/react-beautiful-dnd.js"}]
:pretty-print false}}
:app
{:source-paths ["src/cljs" "src/cljc" "env/dev/cljs"]
:figwheel {:on-jsload "toka.core/mount-root"}
:compiler
{:main "toka.dev"
:asset-path "/js/out"
:output-to "target/cljsbuild/public/js/app.js"
:output-dir "target/cljsbuild/public/js/out"
:source-map true
:optimizations :none
:pretty-print true}}
}
}
我从我在项目中复制的here获得了编译文件。虽然在完成所有这些更改后,我仍然无法在我的组件中使用DragDropContext
或Droppable
。
在我的组件中,我已将它们声明为
(def DragDropContext (reagent/adapt-react-class js/DragDropContext))
(def Droppable (reagent/adapt-react-class js/Droppable))
有谁能帮助我理解我在这里做错了什么?我收到错误如下
Uncaught ReferenceError: DragDropContext is not defined
at core.cljs?rel=1508832729388:11
(anonymous) @ core.cljs?rel=1508832729388:11
注意:由于我不确定包,我在provide
中未添加任何foreign-libs
属性。此外,我不确定是否需要在:require
组件文件中执行core.cljs
。
答案 0 :(得分:1)
您需要添加:provides
(您可以选择您想要的任何名称,例如react-beautiful-dnd
),然后添加require
,以便加载它。由于它取决于React,您应该在requires
中指定它(例如cljsjs.react
如果您将React包含为CLJSJS依赖项):
[{:file "src/cljs/react-beautiful-dnd/react-beautiful-dnd.js"
:provides ["react-beautiful-dnd"]
:requires ["cljsjs.react"]}]
在您的命名空间中:
(ns my.ns
(:require
[cljsjs.react]
[react-beautiful-dnd]))
答案 1 :(得分:1)
我遇到了同样的问题并找到了解决方案。这些组件被放在一个单独的命名空间中,因此必须像这样引用:
(def DragDropContext (reagent/adapt-react-class js/ReactBeautifulDnd.DragDropContext))
(def Droppable (reagent/adapt-react-class js/ReactBeautifulDnd.Draggable))