很多用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, },});
最终读取父类的方法