未能构造“HTMLElement”：请使用“新”运算符

Question

我试图使用AWS放大器身份验证库在一个重新框架的应用程序。库提供了一个高级组件withAuthenticator，它应该包装应用程序的主视图。我正在尝试使用reactify-component和adapt-react-class，但不幸的是，我得到了以下错误：

Uncaught :未能构造‘HTMLElement’：请使用‘new’运算符，此DOM对象构造函数不能作为函数调用。

(defn main-panel []
  [:div
   [:h1 "Hello" ]])

(def root-view
  (reagent/adapt-react-class
    (withAuthenticator
      (reagent/reactify-component main-panel))))

(defn ^:dev/after-load mount-root []
  (re-frame/clear-subscription-cache!)
  (aws-config/configure)
  (re-frame/dispatch-sync [::events/initialize-db])
  (reagent/render [root-view]
                  (.getElementById js/document "app")))

任何帮助都是非常感谢的。

Answer 1

我对试剂+放大有这个问题。

用两个改变解决了它，但我不确定两者是否都需要

#1将Google闭包编译器的输出更改为es6 (或更高)。扩容似乎使用的es6功能，不能多填。

这是针对影子-cljs(影子-cljs.edn)的，但是对于其他构建系统来说，这也是可能的。

{:builds {:app {:compiler-options {:output-feature-set :es6}}}}

免责声明:我从lein-cljsbuild切换到影子cljs，因为我无法获得lein来尊重es6输出的配置。

#2使用功能组件。

在试剂1.0.0-alpha1 1和更高版本中，默认情况下，您可以更改编译器以生成功能组件。

(ns core
    (:require
      [reagent.core :as r]))


(def functional-compiler (r/create-compiler {:function-components true}))
(r/set-default-compiler! functional-compiler)

还有其他方法来制作功能组件。如果您不喜欢或不能使用这种方法，请检查文档。