title: react native make part of TextInput to be bold or italics at run time
body: <p>I have a simple TextInput App like below:</p>
  
  <pre class="lang-js prettyprint-override"><code>export default class App extends Component&lt;Props&gt; {
    constructor(props) {
      super(props);
      this.state = { textValue: '' };
      this.handleTextInputChange = this.handleTextInputChange.bind(this);
    }
  
    handleTextInputChange(input) {
      this.setState({textValue: input})
    }
  
    render() {
      return (
        &lt;KeyboardAvoidingView
           behavior="padding"
           style={{flex:1}}
           enabled&gt;
          &lt;TextInput
            style={styles.textInputStyle}
            multiline={true}
            onChangeText={this.handleTextInputChange}
            value={this.state.textValue}
          /&gt;
        &lt;/KeyboardAvoidingView&gt;
      );
    }
  }
  </code></pre>
  
  
  
  <p>What I'd like to do is when I write <code>##hello</code> in TextInput, what's instantaneously rendered in TextInput screen is <code>hello</code> in bold just like Markdown editing in Dropbox Paper. Similarly, when I write <code>_hello_</code>, what I see in the screen is hello italicized.</p>
  
  <p><a href="https://i.stack.imgur.com/5Qr93.png" rel="nofollow noreferrer">Screen</a></p>
  
  <p><strong>Can I do that? (Have part of TextInput to have different styles)</strong> </p>
  
  <p>So far, it seems like TextInput can only take one style?</p>
  
  <p>If we cannot have different styles TextInput, what might be an alternative to make part of (some kind of TextInput) bold, italicized, bigger, smaller...  </p>