Попытка использовать всплывающую подсказку из пользовательского интерфейса материала приводит к следующей ошибке:
Warning: The final argument passed to useEffect changed size between renders. The order and size of this array must remain constant.
Previous: []
Incoming: [, function () {
if (isControlled !== (controlled !== undefined)) {
console.error(["Material-UI: a component is changing the ".concat(isControlled ? '' : 'un', "controlled ").concat(state, " state of ").concat(name, " to be ").concat(isControlled ? 'un' : '', "controlled."), 'Elements should not switch from uncontrolled to controlled (or vice versa).', "Decide between using a controlled or uncontrolled ".concat(name, " ") + 'element for the lifetime of the component.', "The nature of the state is determined during the first render, it's considered controlled if the value is not `undefined`.";
}
}, 0]
Всплывающая подсказка обернута поверх значка SVG, загруженного с помощью response-svg-loader:
<Tooltip title={'Filters'}>
<div>
<Filter className={classes.topIcon}
onClick={()=> {console.log('Hello');}}/>
</div>
</Tooltip>
Я уже завернул его в div, как рекомендовано в этой теме: Всплывающая подсказка пользовательского интерфейса материала не отображается в пользовательском компоненте, несмотря на распространение свойств на этот компонент
Хотя это заставляет всплывающую подсказку работать, она по-прежнему возвращает ошибку каждый раз, когда мышь наводит курсор на значок и загромождает консоль.
Есть идеи, как от этого избавиться?
Спасибо!
РЕДАКТИРОВАТЬ:
та же ошибка появляется даже при использовании значка из 'material-ui / icons'.
РЕДАКТИРОВАТЬ2:
в крайнем случае попытался окружить простой div в подсказке. Тот же результат - большое красное предупреждение при наведении курсора:
<FormGroup className={classes.percRoot}>
<Tooltip title={'lol'}>
<div>hello</div>
</Tooltip>
</FormGroup>