使用Shadow-CLJS将react表导入到ClojureScript中

Question

这里是网络开发新手。我试图在ClojureScript/Reagent项目中使用包。我没能正确地进口这个包裹。我所做的：

1/通过NPM安装了react table，它在我的项目目录中

2/在我的主命名空间中，我包含了(:require ["react-table" :as rt])

在REPL中，我可以看到它正在建立某种连接，因为只需键入rt就会返回#js {:ReactTableDefaults #js {:data #js [], ...

我怎样才能真正创建一个表呢？我试过这样的事情

rt/ReactTable {:data [{:a 1 :b 2} {:a 3 :b 4} {:a 6 :b 8}] :columns [{:Header "a" :accessor "a"} {:Header "b" :accessor "b"}]}，但我经常撞到TypeError: module$node_modules$react_table$lib$index.ReactTable is not a function

我也读过https://code.thheller.com/blog/shadow-cljs/2017/11/10/js-dependencies-in-practice.html，但这对我没有足够的帮助。

Update --使用我正在取得的进展，这就是我想在影子cljs中再现的内容：

在project.clj：[cljsjs/react-table "6.8.6-0"]中

在“视图”命名空间中：(:require [cljsjs.react-table] [reagent.core :as r])

然后，它实际上显示了一个表：

(def ReactTable (r/adapt-react-class (aget js/ReactTable "default")))
(defn test-table []
  [:div {:style {:width 320}}
  [ReactTable {:data    [{:a 1 :b 2} {:a 3 :b 6} {:a 6 :b 8}]
               :columns [
                     {:Header "a" :accessor "a" :width 200}
                     {:Header "b" :accessor "b" :width 100}]
           :showPagination false
           :defaultPageSize 3}]])

(defn main-panel []
  [test-table])

谢谢!

Answer 1

react-table使用的是“默认”导出，您可能在shadow-cljs构建中没有使用该导出，但在cljsjs变体(即。(aget js/ReactTable "default"))。

所以正确的方法是：

(ns your.app
  (:require ["react-table" :as rt :default ReactTable]))

(defn test-table []
  [:div {:style {:width 320}}
    [:> ReactTable {:data ... :columns ...}]])

文档中的翻译表可能是一个有用的参考。