React - wartość inputów duplikuje się z każdym stworzonym inputem (UseState)

Question

Cześć! Mam problem. Udało mi się w końcu z pomocą forum sprawić aby po kliknięciu przycisku pojawiał się nowy komponent na stronie. W tym komponencie jednak mam inputa, i okazało się, że jak zacząłem pisać coś w jednym inpucie to wszystkie inne stworzone są zapisywane tą samą treścią. Macie może jakiś pomysł gdzie szukać dalej odpowiedzi na mój problem? Naprowadzicie? Z góry dziekuję! Kod dwóch głównych funkcji wklejam poniżej oraz zdjęcie efektu: 
 

const Formularz = () => {
	const id = 0
	const [numberOfAnswer, setNumberOfAnswer] = useState(0);
	const onClick = () => setNumberOfAnswer(numberOfAnswer + 1);
	const pytanie = "Pytanie" + numberOfAnswer
	
	return(
	<div>
		<InputText name="Pytanie" />
		<FieldsWrapper>
			{Array(numberOfAnswer).fill("").map((_, id) => <InputText name ={"odpowiedź: "+id}   key={id}/>)}
			<Button color="link" onClick={onClick}>dodaj odpowiedź</Button>
		</FieldsWrapper>

	</div>
)}


const Yo = () => {
    const [numberOfQuestion, setNumberOfQuestion] = useState(0);
	const onClick = () => setNumberOfQuestion(numberOfQuestion + 1);
    return (
	<div>
       <Button color="link" onClick={onClick} >dodaj pytanie({numberOfQuestion})</Button>
       {Array(numberOfQuestion).fill("").map((_, id) => <Formularz  key={id}/>)}
    </div>)
}

Efekt: 

tutaj większe zdjęcie: 
https://iv.pl/image/Gt3BmVF

 

Comments

Pokaż proszę kod komponentu InputText - zakładając, że w nim jest tworzony każdy input z jakąś treścią.