[英]Can we use class components as children for functional components in React?
我们可以将有状态组件作为无状态功能组件的子代吗?
Short answer: yes. 简短的回答:是的。
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>
Sure no problem, you just need to be aware that it re-renders the children if you didn't redefined shouldComponentUpdate or to use React.memo
没问题,如果您没有重新定义shouldComponentUpdate或使用
React.memo
,您只需要知道它会重新渲染子React.memo
shouldComponentUpdate(nextProps) {
return (this.props.val !== nextProps.val);
}
For further reading: https://reactjs.org/docs/react-component.html#shouldcomponentupdate https://reactjs.org/docs/hooks-faq.html#how-do-i-implement-shouldcomponentupdate 进一步阅读: https : //reactjs.org/docs/react-component.html#shouldcomponentupdate https://reactjs.org/docs/hooks-faq.html#how-do-i-implement-shouldcomponentupdate
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.