Показать дополнительную информацию внутри <DialogContent>с помощью onClick на <Button> - PullRequest
0 голосов
/ 26 мая 2020

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

Поэтому, чтобы понять, что происходит, я добавил consol.log () внутри этой кнопки, чтобы показать сообщение . Но когда я проверяю консоль, этот consol.log () показывает только сообщение в реквизитах: {Children: "Сообщение об ошибке"}, а не как распечатку. В любом случае, мой вопрос: как я могу сделать так, чтобы это сообщение или эта строка кода:

{technicalMessage && tryAgain ? <p>{technicalMessage}</p> : null}

были видны, нажав кнопку moreInfo внутри

return (
    <Dialog onClose={() => dismissPopupError()} open={!!dismissablePopupError}>
      <DialogContent>
        <div
          style={{
            whiteSpace: 'pre-wrap',
          }}
        >
          {/*technicalMessage && tryAgain ? <p>{technicalMessage}</p> : null*/}
          <Button
            onClick={() => {
              console.log(technicalMessage && tryAgain ? <p>{technicalMessage}</p> : null)
            }}
          >
            More Info
          </Button>
        </div>
      </DialogContent>

      <DialogActions>
        <>{okButton}</>
      </DialogActions>
    </Dialog>
  )
...