Как передать значение из одной ф-ции в другую в функциональном компоненте?

Нужно удалить строку из таблицы, но перед удалением показать модалку с предупреждением. Как самой модалке можно узнать айдишник удаляемой строки таблицы?

   const Component = ({ rows }) => {
      const [modalIsVisible, setModal] = false;

      const deleteRow = () => {
        // how to get id of row to delete here?
      }

      return (
        <div>
          <table>
            {rows.map(row => (
              <tr>
                <td>
                  <div>row of id {row.id}</div>
                  <button onClick={() => setModal(true)}>Delete row</button>
                </td>
              </tr>
            )}
          </table>
          <Modal isVisible={modalIsVisible}>
            <button onClick={deleteRow}>Delete anyway</button>
            <button onClick={() => setModal(false)}>Close</button>
          </Modal>
        </div>
      )
    }

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


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