Dynamically render input boxes based on fetched API results without useState? #2104
-
Hi @bluebill1049 and everyone, thanks for this great library 😄 I have a question about registering checkboxes dynamically based on an API call.
[
{ id: 1, name: "cats", label: "Cats", value: true },
{ id: 2, name: "dogs", label: "Dogs", value: false },
{ id: 3, name: "parrots", label: "Parrots", value: false }
];
const petCheckboxes = petsData.map(petData => (
<li key={petData.id}>
<input
type="checkbox"
defaultChecked={petData.value}
name={petData.name}
ref={register}
id={petData.id}
/>
<label htmlFor={petData.id}>{petData.label}</label>
</li>
)); Right now, I'm storing the result of the API call in |
Beta Was this translation helpful? Give feedback.
Replies: 2 comments
-
I think you will need useState with this because you need a refresh when API resolves. |
Beta Was this translation helpful? Give feedback.
-
@bluebill1049 Got it. Thank you for your quick response! |
Beta Was this translation helpful? Give feedback.
I think you will need useState with this because you need a refresh when API resolves.