override set style action in TextInput

Question

I found react native could extends parent class and override some function.I want to know if it is possible or there is another way to make it.

export default class AppTextInput extends TextInput {

    constructor(props){
       super(props);
    }

    //here is some code I want to do
    style(value){

        var fontSize = value.fontSize;

        //change fontSize
        fontSize = fontSize*2;

        value.fontSize = fontSize;

       //call parent set style function

    }


}

In actionscript 3,I could do like this

//do something when visible was set
override public function set visible(value:Boolean):void
{
}

EDIT

    hasTriggleFontSizeChange = false;

    realFontSize = 12;

    componentWillMount() {
        var tempStyle = this.props.style;

        if (!this.hasTriggleFontSizeChange) {
            this.hasTriggleFontSizeChange = true;

            var tempFontSize = 6;

            if (tempStyle.hasOwnProperty('fontSize')) {
                tempFontSize = tempStyle['fontSize'];
            }

            tempFontSize = 12;

            var style = {fontSize: tempFontSize};

            let styles = this.props.style;

            //this line can change styles fontSize Value
            styles = {...styles, fontSize: tempFontSize};

            //but this line can't change styles fontSize Value
             this.props.style = styles//{...this.props.style, fontSize: tempFontSize};
        }

    }

Answer 1

You shouldn't use inheritance, but rather composition. If you want to have a custom TextInput, here's an example of how you could achieve that:

import React, { Component } from 'react';
import { TextInput } from 'react-native';

export default class CustomTextInput extends Component {
  state = {}

  render() {
    const { props } = this;
    const style = { fontSize: props.fontSize || 14 }
    return (
      <View style={myStyle}>
        <TextInput
          style={style}
          placeholder={props.placeholder}
          underlineColorAndroid="transparent"
          value={props.value}
          placeholderTextColor={props.placeholderTextColor ? props.placeholderTextColor : colors.lightGray}
        />
      </View >
    );
  }

}