Не удалось создать HTMLElement: используйте оператор new. - PullRequest
0 голосов
/ 06 мая 2020

Я пытаюсь использовать AWS Amplify Authentication lib в приложении для изменения кадра. Библиотека предоставляет компонент более высокого порядка withAuthenticator, который должен заключать в оболочку основное представление вашего приложения. Я пытаюсь использовать reactify-component и adapt-react-class, но, к сожалению, получаю следующую ошибку:

Uncaught TypeError: не удалось создать «HTMLElement»: используйте оператор «новый», этот объект 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")))

Любая помощь приветствуется

1 Ответ

0 голосов
/ 02 сентября 2020

У меня была эта проблема с реагентом + амплификацией.

Решено с двумя изменениями, но я не уверен, нужны ли оба

# 1 Измените вывод компилятора закрытия Google на es6 (или выше). Amplify, похоже, использует функции es6, которые не могут быть полифиллированы.

Это для shadow-cl js (shadow-cl js .edn), но это должно быть возможно и для других систем сборки. {:builds {:app {:compiler-options {:output-feature-set :es6}}}}

Отказ от ответственности: я переключился на shadow-cl js из lein-cljsbuild, так как я не мог заставить lein-cljsbuild соблюдать конфигурацию вывода es6.

# 2 Использовать функционал компоненты.

В реагенте 1.0.0-alpha1 и выше вы можете изменить компилятор для создания функциональных компонентов по умолчанию.

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


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

Существуют и другие способы создания функциональных компонентов. Обратитесь к документации , если вам не нравится или вы не можете использовать этот подход.

...