很多用React Native的同学都是前端工程师,在传统的js没有继承的概念。但是在react Native所支持的es6是有继承的,效果也是不错的,分享给大家。
首先定义一个BaseComponent,例如有一个fullName的方法
import React, { Component } from 'react';
export default class BaseComponent extends Component {
constructor(props) {
super(props);
}
fullName() {
return 'test'
}
}
定义一个类,运行的时候,动态读取父类的方法
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View
} from 'react-native';
import BaseComponent from './BaseComponent';
export default class PageComponent extends BaseComponent {
render() {
return (
<View style={{flex: 1,paddingTop: 50,}}>
<Text style={styles.welcome}>
{ this.fullName() }
</Text>
</View>
);
}
}
const styles = StyleSheet.create({
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
});
最终读取父类的方法