react中通过extend继承,父组件为什么能访问子组件的属性
代码如下,在父类的componentWillMount方法中输出 this,打印的却是子类 item
通过webpack的编译后文件中可以看到,Item方法中实际上有注入一个 _List参数,
问题: react 中的extends 与 es6中的extends的有什么区别吗?
class List extends React.Component{
constructor(props){
super(props);
this.state = {
List: [4,5]
}
}
componentWillMount(){
console.log(this);
console.log(this.state.List);
}
}
class Item extends List{
constructor(props){
super(props);
this.state = {
List : [1,2,3]
}
}
render(){
return (
<div>123</div>
)
}
}
React.render(<Item />, document.getElementById('app'));
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(4)
没有区别;
组件不要用继承。
父子组件的通信可以在父组件写一个函数,作为属性带给子组件,子组件用通过调用它把一些东西传回去
嗯 谢谢回答。
我其实想问 父组件中为什么能够访问子组件的属性,而采用es6的中这种方式却无效。
另外react中组件继承有什么缺点吗? 组件不都是继承自 React.Component吗?
刚刚碰到同样的问题,在这里没有得到解答,问同事解决了:
组件A有个getDate()方法,只有定义没有调用,但实际确实执行了,查找代码发现组件A继承自组件B,组件B也定义了一个getData()方法,但是个return null;的空方法,然后在组件B的生命周期函数中调用了这个方法this.getData(),到这里就看不懂了,自以为是父类组件调用到子类组件的方法,感觉违背常理了,其实是理解错了: