react 组件之间可以继承吗

2025-05-10 21:24:38
推荐回答(1个)
回答1:

如果公用的东西,是一些方法,可以 使用 React 的 Mixins(ES5) ,高阶组件(ES6)【高阶函数不太了解,如何使用,去找下资料 】
但是如果有公用的属性,那么就有点 力不从心了
在想,React 中,是否可用继承 自定义的组件?
经过一番查找资料,发现,React 是可以 继承 自己定义的组件的
二、解决方案
实现的步骤很简单,只需要 把
classWin extends React.Component
替换成
classWin extends BaseWin
1. 例子代码
importReact from 'react'

/**
* 所有弹框的基类
*/
classBaseWin extends React.Component{
constructor(props){
super(props);
this.name ='zhongxia';
this.state ={};
}
common(){
alert('this is a common function!')
}
}
exportdefaultBaseWin;
importReact from 'react'
importBaseWin from './baseWindow'

classWin extends BaseWin{
constructor(props){
super(props);
this.state ={
...this.props
};
console.log(this.name);
this.common();
}
getData(){
returnthis.state;
}
render(){
this.state.node.model.set({name:'zhongxia', age:17})
return(


弹框1







);
}
}

exportdefaultWin;
2. 实例化 React 组件的顺序 和效果图
实例化子类组件 ==》 构造函数里面 super(prop)的时候去实例化 父类组件 ==》 父类组件实例化结束 ==》 子类组件实例化结束

1. 子类构造函数

2. super(props) 实例化父类

3. 子类构造函数结束,已经可以拿到父类的属性和方法

4. 子类实例开始渲染页面