Как правильно создать текстовый инпут порождающий другой инпут?

Всем привет, подскажите пожалуйста как правильно в реакте сделать текстовый инпут, который при вводе будет порождать еще такой же инпут, который может создать следующий и так далее.


Ответы (1 шт):

Автор решения: RTW

Приветствую вас на Stackoverflow.

Площадка не предназначена для просьб "сделайте за меня", поэтому в будущем прикладывайте ваши попытки что-то сделать и спрашивайте конкретно, если что-то не получается.

Ссылка.

Код:

import React from "react";
import "./styles.css";

export default function App() {
  const [inputsNum, setInputsNum] = React.useState([1]);

  const handler = num =>
    inputsNum.length === num ? setInputsNum([...inputsNum, num + 1]) : null;

  return (
    <div className="App">
      {inputsNum.map(num => (
        <input onChange={() => handler(num)} key={num} />
      ))}
    </div>
  );
}
→ Ссылка