我們可以在React中將類組件用作功能組件的子代嗎？

Question

我們可以將有狀態組件作為無狀態功能組件的子代嗎？

Answer 1

簡短的回答：是的。

 class B extends React.Component { render() { return <div>Class Component</div> } } const A = () => <div className="a">Stateless Functional Component <B /></div> ReactDOM.render(<A />, document.getElementById('app')); 

 .a {background: red; padding: 5px;} .a div {background: green;} 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script> <div id="app"></div> 

Answer 2

沒問題，如果您沒有重新定義shouldComponentUpdate或使用React.memo ，您只需要知道它會重新渲染子React.memo

shouldComponentUpdate(nextProps) {
    return (this.props.val !== nextProps.val);
}

進一步閱讀： https : //reactjs.org/docs/react-component.html#shouldcomponentupdate https://reactjs.org/docs/hooks-faq.html#how-do-i-implement-shouldcomponentupdate