reactjs 第一次渲染的材质UI工具提示通知错误

ahy6op9u  于 2023-06-05  发布在  React
关注(0)|答案(2)|浏览(130)

我在react中使用材质工具提示。我已经为工具提示MaterialTooltip创建了一个自定义组件 Package 器,如下所示:

import { Tooltip } from '@mui/material';

const MaterialTooltip = props => {
  return (
    <Tooltip
      PopperProps={{ sx: { fontSize: '16px' } }}
      arrow={props.disableArrow || !props.title ? false : true}
      placement={props.placement ? props.placement : 'top'}
      title={props.title ? props.title : ''}
    >
      {props.children}
    </Tooltip>
  );
};

export default MaterialTooltip;

并这样称呼它:

{
  myArray.map((row, index) => {
    return (
      <MaterialTooltip key={index} title={row.condition ? tooltipText : ''}>
        <div className={someDynamicClass}>{row.text}</div>
      </MaterialTooltip>
    );
  });
}

当我第一次将鼠标悬停在存在工具提示的文本上时,它第一次在控制台中显示错误:

对于随后的悬停或此后的任何其他句子悬停,没有任何错误。有谁能提出这个错误的原因和可能的解决方案吗?它正确地呈现了工具提示,但控制台只给出了一次此错误。
更新:问题仅发生在开发版本上,而不是生产版本上。

mftmpeh8

mftmpeh81#

错误可能来自其他地方,它工作得很好:Codesandbox

mwkjh3gx

mwkjh3gx2#

您的代码没有错误。myArray的数据是静态的吗?我认为是数据更改导致了问题。

相关问题