很多用React Native的同學(xué)都是前端工程師牲阁,在傳統(tǒng)的js沒有繼承的概念叠萍。但是在react Native所支持的es6是有繼承的谓着,效果也是不錯的吼过,分享給大家锐秦。
首先定義一個BaseComponent,例如有一個fullName的方法
import React, { Component } from 'react';
export default class BaseComponent extends Component {
constructor(props) {
super(props);
}
fullName() {
return 'test'
}
}
定義一個類那先,運行的時候农猬,動態(tài)讀取父類的方法
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,
},
});
最終讀取父類的方法