Итак, я пытаюсь визуализировать автозаполнение MUi с помощью реагента. Это моя попытка
(def options
(clj->js
[{:title "title" :year 1990}
{:title "title2" :year 2990}]))
(defn autocomplete-text-field []
[:> TextField
{:label "Headers"
:id "header"
:variant "outlined"
:fullWidth true }
]
)
(defn add-header-form []
[:> Card
{:style #js {:max-width 1000}}
[:> CardHeader {:title "Add Header"}]
[:> CardContent
[:> Grid
{:container true
:direction "column"}
[:> Autocomplete
{
:renderInput (r/reactify-component autocomplete-text-field)
:options options
:getOptionLabel #(get % :year)}
]
]
]]
)
Я пытался передать ее напрямую, имея в виду :renderInput autocomplete-text-field
Но не смог понять. Я пытаюсь перевести пример на странице Mui:
https://material -ui.com / components / autocomplete /
РЕДАКТИРОВАТЬ
<Autocomplete
options={top100Films}
getOptionLabel={(option: FilmOptionType) => option.title}
style={{ width: 300 }}
renderInput={params => (
<TextField {...params} label="Combo box" variant="outlined" fullWidth />
)}
/>
Итак, что мне после того, как мне написать эквивалентный код реагента для этого свойства renderInput?
Заранее спасибо.