validateDOMNesting (...) предупреждение при добавлении функции «перенаправить на страницу по клику» в строку таблицы - PullRequest
Новая
       15

validateDOMNesting (...) предупреждение при добавлении функции «перенаправить на страницу по клику» в строку таблицы

0 голосов
/ 29 апреля 2019

У меня есть проект ReactJS, и я использую Material UI для инфраструктуры UI.На одной из страниц у меня есть таблица сообщений, вроде почтового ящика, где я хочу перенаправить пользователя на другую страницу, которая содержит всю цепочку для строки сообщения, по которой пользователь щелкает.

У меня есть следующий код: 

<TableBody>
              {this.state.messageList.map((row, index) => {
                return (
                  <TableRow key={index} hover
                    style={{ textDecoration: "none" }} //to remove underline
                    component={Link} to={`/messages/thread/${row.messageid}`}
                  >
<TableCell>{row.attachments.length !== 0 && <AttachFileIcon />}</TableCell>
                      <TableCell>
                        <Typography style={{ fontWeight: row.viewedon == null && "bold" }}>{row.note}</Typography>
                      </TableCell>
                      <TableCell>
                        <Typography>{moment(row.created).format("DD-MMM-YYYY HH:mm")}</Typography>
                      </TableCell>
</TableRow>

Тем не менее, я получаю следующие предупреждения на своей консоли, независимо от того, сколько элементов у меня в списке. 

Warning: validateDOMNesting(...): <td> cannot appear as a child of <a>.
...
Warning: validateDOMNesting(...): <td> cannot appear as a child of <a>
...
Warning: validateDOMNesting(...): <td> cannot appear as a child of <a>.
...
Warning: validateDOMNesting(...): <a> cannot appear as a child of <tbody>.
...

Я считаю, что проблема в том, как я связываю TableRow со ссылкой, но я не уверен, как ее решить.

Буду признателен за любую помощь в этом.

Спасибо.

...