相关疑难解决方法(0)

当hiddenLogo改变值时，组件被重新呈现。我希望此组件永远不会重新渲染，即使其道具发生了变化。使用类组件，我可以这样实现sCU：

shouldComponentUpdate() {
  return false;
}

但是，有没有办法处理React挂钩/ React备忘录？

这是我的组件的外观：

import React, { useEffect } from 'react';
import PropTypes from 'prop-types';

import ConnectedSpringLogo from '../../containers/ConnectedSpringLogo';

import { Wrapper, InnerWrapper } from './styles';
import TitleBar from '../../components/TitleBar';

const propTypes = {
  showLogo: PropTypes.func.isRequired,
  hideLogo: PropTypes.func.isRequired,
  hiddenLogo: PropTypes.bool.isRequired
};

const Splash = ({ showLogo, hideLogo, hiddenLogo }) => {
  useEffect(() => {
    if (hiddenLogo) {
      console.log('Logo has been hidden');
    }
    else {
      showLogo();

      setTimeout(() => {
        hideLogo();
      }, 5000); …

据我所知，当商店中的任何内容发生变化时，redux 都会通知所有订阅者到商店，无论是订阅深层嵌套的叶子还是订阅顶级状态。

在您遵循指导原则的应用程序中：

许多单独的组件应该连接到商店而不是仅仅几个...... [文档]

您最终可能会遇到很多听众和潜在的性能问题？

免责声明：我了解选择器函数只会在选择器函数的结果发生变化时导致重新渲染。我明白，仅仅因为监听器函数被评估，并不意味着订阅组件会重新渲染。我知道评估选择器函数比反应组件渲染相对便宜。

但是，我只是想确认这确实是 redux 的工作原理吗？

例如给出以下示例侦听器

const result = useSelector(state => state.a.b.c.d.e.f.g.h.i.j.k)

如果我们沿其他路径更新其他值，则与上述侦听器无关，例如

const exampleReducer = (state) => {
   return { ...state, asdf: 'asdf' }
}

根据我的理解，所有监听器，包括上面的例子，都会被调用。

对于上下文，我的实际用例是我使用的是基于 redux 的https://easy-peasy.now.sh/。需要明确的是，我在生产中没有任何与绑定太多侦听器相关的当前性能问题。然而，每次我通过useStoreState钩子附加一个侦听器时，我想知道是否应该最小化绑定另一个侦听器到商店。

另外，如果你好奇，受到这种想法的启发，我实现了一个状态树，它只通知相关的听众。

也许这是对状态库的过早优化......但如果是这样，为什么？是否假设使用 redux 的应用程序将具有简单快速的选择器并且应用程序瓶颈将在其他地方？

如果父级重新渲染，React 中的子级也会重新渲染，无论传递的 props 是否改变。

React为什么要这样做？如果 React 在父级渲染时不重新渲染子级（没有更改道具），会出现什么问题？

 import React, { useMemo, useState } from "react";
    import "./App.css";
    import { Item, MyList } from "./MyList";
    
    function App() {
      console.log("render App (=render parent)");
    
      const [val, setVal] = useState(true);
      const initialList = useMemo(() => [{ id: 1, text: "hello world" }], []); // leads to "The parent component rendered"
      //const initialList: Item[] = []; // leads to "Props changed: (initialList)"
    
      return (
        <div style={{ border: …