Как решить ошибку props при дубликате компонента?

Question

[Danoneko]

Добрый день!

Столкнулся с проблемой при передаче пропсов. Есть родительский компонент Parent, который получает callback'ом функцию setValue от Child.

import React, { useState } from "react";

const Parent = () => {
const [value, setValue] = useState([]);
console.log(value);
  return (
          <Child setValue={setValue} name={name1} title={title1}  />
          {/* <Child setValue={setValue} name={name2} title={title2}  /> */}
  );
};

Дело в том, что мне необходим такой же компонент, с другими пропсами и другим результатом той же функции.

Что интересно, вывод функции происходит только от последнего добавленного ребенка, в то время как в консольке функция первого ребенка выводит и затирается вторым.

Как это исправить?

Comments

[Владимир]

Не пойму проблемы: два ребёнка по очереди пишут в один и тот же стейт. Логично, что там будет то значение, которое было записано последним. Как ещё это может работать?

Answer 1

[Егор Живагин]

А может у вас каким-то образом функция сразу в обоих child вызывается?

В остальном, это должно работать нормально, функция создана в Parent, Child-ы просто вызывают её через пропс

Comments

[Danoneko]

Предполагаю, что функция первого child затирается и перезаписывается вторым. Но как это исправить, не совсем понимаю. Может как-то результат второй функции пушить к первой, или делать проверку с каким ребенком работаем