Reagent / ClojureScript - обновления многокомпонентных аспектов

У меня есть компонент выбора, который показывает метку и связанные параметры. Существует отдельный «язык» для выбора языка дисплея. При изменении он обновляет как @language, который выбирает язык меток, так и @search-language-options, который предоставляет параметры для выбора. Ярлык обновляется, как ожидалось, но список опций не обновляется - он остается в исходном состоянии.

;; search-languages -> vector
;; return the languages referenced in the data for options use

(defn search-languages []
  (let [options (list (tr {:dict ld} [@language :en] [:choice-any]))]
  (if (= @language :or) (concat options (vec (set (map (partial get-field "lang") parsed-json))))
    (concat options (vec (set (map (partial get-field "langTranslated") parsed-json)))))))

(def search-language-options (r/atom (search-languages)))

;; filter component -> component
;; create a select
(defn select-filter-component [label value options]
  [:div {:class "form-group"}
  [:label {:class "control-label" :for label} label]
  [:select {:id label :class "form-control" :value @value :on-change #(reset! value (-> % .-target .-value))}
    (for [opt options]
      ^{:key opt} [:option {:value opt} opt])]])

;; lang-select -> component
;; choose display language 
(defn lang-select []
[:div {:class "form-control" }
  [:select {:id :en :value @language :on-change (fn [e]
    (reset! language (.. e -target -value))
    (reset! search-language-options (search-languages)))
    }
  ^{:key :en} [:option {:value :en} "English"]
  ^{:key :fr} [:option {:value :fr} "Français"]
  ^{:key :es} [:option {:value :es} "Español"]
  ^{:key :or} [:option {:value :or} "Original language"]
  ]])

;; filter form
;; filter the results
(defn filter-form []

[:form {:class "form-inline"}
[search-filter-component (tr {:dict ld} [@language :en] [:search] ) search-text]

[select-filter-component (tr {:dict ld} [@language :en] [:language] ) search-language @search-language-options]
[select-filter-component (tr {:dict ld} [@language :en] [:gender] ) gender ["Any" "M" "F"]]
[select-filter-component (tr {:dict ld} [@language :en] [:continent/title] ) continent ["Any" "Europe"]]
[select-filter-component (tr {:dict ld} [@language :en] [:country] ) placeTranslated ["Any" "Austria" "Switzerland" "Germany"]]
[select-filter-component (tr {:dict ld} [@language :en] [:literaryForm] ) literaryForm ["Any" "Drama" "Poetry" "Prose: fiction" "Prose: non-fiction" ]]
[select-filter-component (tr {:dict ld} [@language :en] [:genre] ) genre ["Any" "Short story" "Novella" "Graphic Novel"]]
[reset-button]]

)

clojurescript reagent
person Steve    schedule 16.11.2018    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Вы имеете в виду, что [:option...] элементы в select-filter-component не меняются? Если вы это имеете в виду, то по опубликованному коду трудно сказать, почему они не меняются, потому что эти параметры отображаются на основе свойств, переданных в select-filter-component, а вы не показали, как вы вызываете select-filter-component. В частности, этот код полностью зависит от переданной опоры options:

(for [opt options]
   ^{:key opt} [:option {:value opt} opt])

(Примечание: хотя здесь это не имеет значения, обратите внимание, что for ленив, поэтому, если вы когда-либо ссылаетесь на атом в for, обратите внимание, что вам придется заключить его в doall, иначе на атом не будет ссылаться во время рендеринга и ваш компонент не будет обновляться при обновлении атома.)

Если вы имеете в виду, что выбор различных параметров с помощью мыши не работает, то это потому, что вы закомментировали обработчик on-change.

person Justin L.    schedule 17.11.2018
comment
Элементы [: option ...] в select-filter-component не меняются. Я добавил в фрагменты код вызова select-filter-component. Не обращайте внимания на `(tr ...), это просто делает i18n вещи. - person Steve; 20.11.2018
comment
Как правило, замена опций, похоже, работает на небольшом примере в моем репо. Попробуйте несколько операторов журнала в каждом компоненте, чтобы увидеть, повторяются ли они с ожидаемыми вами данными. (Обратите внимание: когда вы меняете параметры местами, вы меняете местами не только отображаемое имя, но и значение. Необходимо будет заменить атом значения, иначе выбранное значение будет недействительным, и вы потеряете состояние выбора.) - person Justin L.; 23.11.2018