Я получаю следующую ошибку в React 16.8
:
Предупреждение: компонентам функций без состояния не могут быть даны ссылки. Попытки получить доступ к этой ссылке потерпят неудачу.
Check the render method of `Button`.
in NavLink (created by Button)
in Button
in Unknown (created by StyledComponents__ButtonLink)
in StyledComponents__ButtonLink (created by PageHeaderLayout)
in div (created by PageHeaderLayout)
in b (created by PageHeaderLayout)
in div (created by GridColumn)
in GridColumn (created by PageHeaderLayout)
in div (created by GridRow)
in GridRow (created by PageHeader__PageHeaderRow)
in PageHeader__PageHeaderRow (created by PageHeaderLayout)
in PageHeaderLayout (created by PageHeader)
in PageHeader (created by Connect(PageHeader))
in Connect(PageHeader) (created by Route)
in Route
in Switch
in Unknown (created by BaseLayout)
in div (created by Grid)
in Grid (created by BaseLayout__ContentGrid)
in BaseLayout__ContentGrid (created by BaseLayout)
in div (created by BaseLayout__LayoutContainer)
in BaseLayout__LayoutContainer (created by BaseLayout)
in BaseLayout
in Router (created by BrowserRouter)
in BrowserRouter
in AppContainer
in Provider
Это происходит в следующем коде:
<b><br />
{entityLinks.map(({ popup, ...linkProps }) =>
<div key={linkProps.content}>
<ButtonLink as={NavLink} {...linkProps} />
{popup && <Popup content={popup} trigger={<Icon name="help circle outline" color="grey" />} />}
</div>,
)}
</b>
Где ButtonLink
:
import React from 'react'
import styled from 'styled-components'
import { Button } from 'semantic-ui-react'
export const ButtonLink = styled(({ color, padding, ...props }) => <Button {...props} />).attrs({ basic: true })`
&.ui.button.basic {
white-space: nowrap;
...
...
The entityLinks
, которые передаются в ButtonLink
- это просто массив такой структуры:
const entityLinks = [{
to: `/variant_search/${searchType}/${searchId}`,
content: `${snakecaseToTitlecase(searchType)} Variant Search`,
disabled,
popup: disabled ? 'Search is disabled until data is loaded' : null,
}]
Как я могу это исправить? Я просмотрел несколько похожих тем, но все еще не могу это исправить в данном конкретном случае. Вот как выглядит расширенный код React
в Chrome
: