при нажатии кнопки необходимо добавить значение состояния -12 с 50, а значение результата ie (38) должно измениться на значение dest, а значение источника должно стать 0 - PullRequest
0 голосов
/ 22 апреля 2020

при нажатии кнопки необходимо добавить значение состояния -12 с 50, а результирующее значение ie (38) должно обновиться до значения destcommomRowData, а значение srcommomRowData должно стать 0

, возможно ли достичь

есть предложения?

см. Ниже фрагмент

import React, { useState } from "react";

const Test = () => {
  let srcommomRowData = {
    2020: { firstLevel: { children: { secondLevel: { value: -12 } } } },
  };

  let destcommomRowData = {
    2020: { firstLevel: { children: { secondLevel: { value: 50 } } } },
  };
  const [srcdata, srcsetData] = useState(srcommomRowData);
  const [destdata, destsetData] = useState(destcommomRowData);
  const updateData = () => {};
  return (
    <div>
      <div>Testing</div>
      <div>
        <button onClick={updateData}> Click </button>
      </div>
    </div>
  );
};

export default Test;



1 Ответ

0 голосов
/ 22 апреля 2020

Во-первых, вам не нужно обновлять переменные. Вы должны обновлять только состояние - единственная причина, по которой вам может потребоваться сохранить исходные данные в переменных за пределами состояния, - это удобочитаемость.

Для достижения sh вашей цели вам необходимо установить значение состояния целевого состояния данных с помощью значение состояния данных sr c, а затем обновите значение состояния данных sr c:

const Test = () => {
  const srcCommomRowData = {
    2020: { firstLevel: { children: { secondLevel: { value: -12 } } } }
  };

  const destCommomRowData = {
    2020: { firstLevel: { children: { secondLevel: { value: 50 } } } }
  };
  const [srcData, setSrcData] = useState(srcCommomRowData);
  const [destData, setDestData] = useState(destCommomRowData);

  const updateData = () => {
    setDestData(destData => {
      const updatedData = { ...destData };
      updatedData[2020].firstLevel.children.secondLevel.value +=
        srcData[2020].firstLevel.children.secondLevel.value;
      return updatedData;
    });
    setSrcData(srcData => {
      const updatedData = { ...srcData };
      updatedData[2020].firstLevel.children.secondLevel.value = 0;
      return updatedData;
    });
  };

  return (
    <div>
      <div>Testing</div>
      <br />
      <div>
        <button onClick={updateData}> Click </button>
      </div>
    </div>
  );
};
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

См. Этот рабочий пример, в котором отображаются значения: https://codesandbox.io/s/condescending-franklin-e1l9s?file= / src / Test. js: 42-1213

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