Я использую реаги, редукцию с неизменяемым js. Я сталкиваюсь с проблемой, когда использую useEffect или аналогичные перехватчики с не примитивными данными, этот эффект работает, даже если он не изменился, поскольку я использую ho c, рекомендованный redux docs .
Есть ли у кого-нибудь решение или лучшая практика для использования неизменяемого js и приставки с перехватчиками реагирования?
Это мой родительский компонент.
import { useSelector, useDispatch } from "react-redux";
import { setValue, getValue, getData } from "./store";
import "./styles.css";
import Child from "./Child";
export default function App() {
const data = useSelector(getData);
const value = useSelector(getValue);
const dispatch = useDispatch();
return (
<div className="App">
<h1>Hello CodeSandbox</h1>
<h2>Start editing to see some magic happen!</h2>
<button onClick={() => dispatch(setValue(value + 1))}>
Change Value
</button>
<Child value={value} data={data} />
</div>
);
}
Это дочерний компонент, который является завернутый в JS ho c
import { toJS } from "./hoc";
function Child(props) {
useEffect(() => {
// this runs even if only props.value has changed.
console.log(props.data, "changed");
}, [props.data]);
return <div>{props.value}</div>;
}
export default toJS(Child);
Воспроизводимый пример: