I'd like to use Mantine's MultiSelect but only fetch from the server the dropdown data the first time users open the dropdown.
Most obvious candidate seems to be the onDropdownOpen
where I could fetch the data but I don't know how to reference the element and its data in there. Thought I could reference it, but the code at the bottom on the doc as copied below doesn't compile (doesn't like the brackets after HTMLInputElement
):
import { useRef } from 'react';
import { MultiSelect } from '@mantine/core';
function Demo() {
const ref = useRef<HTMLInputElement>();
return <MultiSelect ref={ref} data={[]} />;
}
Being very new to React, I feel I'm missing the obvious here so it'd be great if you could point me in the right direction.
I finally came up with this which seems to work. Would love to have some feedback as I stated above, I'm a begginer with React and coming from simple javascript it's a bit hard adapt to the philosophy.