How do I enable smooth animation during dynamic addition of components in react native?

You can do this a few ways, but you'll likely want to make use of the Animated library:

import { Animated } from 'react-native'

You store the (style property) value in state:

this.state = { myViewHeight: new Animated.Value(300) }

(myViewHeight would be used as a style prop in this example, <View style={{ height: myViewHeight }})

And then to alter the value gradually, run an animation on it:

Animated.timing(this.state.myViewHeight, {
  toValue: 600,
  duration: 300
}).start()

In this example, it would gradually raise the height of the view from 300 to 600.

However, since you want to show more text, I think if I were you I might convert the text to an array of words and animate the percent of words shown.

There's a good guide here.

Try these services for smooth rendering from react-native Docs

import {
  NativeModules,
  LayoutAnimation 
} from 'react-native';

const { UIManager } = NativeModules;

componentWillUpdate() {
   UIManager.setLayoutAnimationEnabledExperimental && UIManager.setLayoutAnimationEnabledExperimental(true)
   LayoutAnimation.spring();
}