[英]'children' is not defined - in React class component
所以,我有一个使用“React.Children.map()”的无状态组件,我想把它变成一个类组件来给它添加一个状态,但是因为我不能(据我所知)将 {children} 作为属性传递再一次,我收到错误消息,指出未定义“儿童”。 我该如何定义孩子?
原始无状态组件:
import React from 'react';
const Tabs = ({ children }) => (
<div className="tabsPanel" onClick={clickHandler}>
{React.Children.map(children, child =>
React.cloneElement(child, { clickHandler: () => console.log('clicked') })
)}
</div>
);
export default Tabs;
类组件:
import React, { Component } from 'react';
class Tabs extends Component {
render() {
return (
<div className="tabsPanel">
{React.Children.map(children, child =>
React.cloneElement(child, {
clickHandler: () => console.log('clicked', child.props.children),
})
)}
</div>
);
}
}
export default Tabs;
您尚未在 render 方法中定义children
变量。 props 作为函数组件的第一个参数给出,但它们在类组件中的this.props
中可用。
class Tabs extends Component {
render() {
return (
<div className="tabsPanel">
{React.Children.map(this.props.children, child =>
React.cloneElement(child, {
clickHandler: () => console.log('clicked', child.props.children),
})
)}
</div>
);
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.