Reactjs 在React中初始加载后停止重新加载卡舌

我有一个反应选项卡布局，看起来像这样

Tab.js：

class Tab extends React.Component {
    constructor(props) {
        super(props);
        this.onTabClick = this.onTabClick.bind(this);
    }

    onTabClick() {
        this.props.handleTabClick(this.props.tabIndex);
    }
    render() {
        const { label, isActive, handleTabClick } = this.props;

        return (
            <li className="nav-item">
                <a className={this.props.isActive ? 'nav-link nav-active' : 'nav-link'}

                    onClick={this.onTabClick}
                >
                    {label}
                </a>
            </li>
        );
    }
}

class选项卡扩展了React.Component{
建造师（道具）{
超级（道具）；
this.onTabClick=this.onTabClick.bind（this）；
}
onTabClick（）{
this.props.handleTabClick（this.props.tabIndex）；
}
render（）{
const{label，isActive，handleTabClick}=this.props；
返回(

{label}

);
}
}

TabHeader.js：

const TabsHeader = ({ activeTabIndex, data, handleTabClick }) => (
    <div>
      <ul className="nav nav-tabs border-0 align-self-center justify-content-between">
        {data.map(({ label }, index) => {
          const isActive = activeTabIndex === index;
          return (
            <Tab
              key={index}
              label={label}
              isActive={isActive}
              handleTabClick={handleTabClick}
              tabIndex={index}
            />
          );
        })}
      </ul>
    </div>
);

const TabsHeader=（{activeTabIndex，data，handleTabClick}）=>(

{data.map（{label}，index）=>{
const isActive=activeTabIndex==index；
返回(
);
})}

);

---

我想在每次单击选项卡时停止重新加载选项卡内容，但我不确定如何才能做到这一点？目前，它最初加载，然后每次单击选项卡时重新加载。我怎样才能解决这个问题？谢谢

您可以在react组件内使用

shouldComponentUpdate

函数<如果此函数返回

false

shouldComponentUpdate(nextProps, nextState) {
  return this.state.value != nextState.value;
}

---

了解更多关于

哦，好的！你是说在TabsHeader.js里面？在我把它转换成类之后，在每个组件中使用这个，如果它的道具或状态没有改变，你就不想重新渲染。如果您根本不希望组件重新渲染，只需从函数返回false即可。谢谢您的回答！是的，我不确定我是否做得不对，但它似乎并没有停止为我的选项卡重新排序。我共享了一个链接，指向

shouldComponentUpdate

函数的react文档。关于这个函数，你现在需要做的就是在那里。在重新呈现任何组件之前，将调用此函数，如果此函数返回false，则组件不会更新