react-nativereact-native-textinputreact-native-text

Not able to set inital height to TextInput component based on the content in React Native


I am having a TextInput component as shown below

   <TextInput
      defaultValue={inputDescription}
      multiline={true}
      onChangeText={e => setInputDescription(e)}
      style={[Style.descriptionInput, { height: descriptionHeight }]}
      onContentSizeChange={e =>
        setDescriptionHeight(e.nativeEvent.contentSize.height)
      }
      placeholder={'Take a note'}
      placeholderTextColor={'black'}
    />

With the onContentSizeChange prop, I'm getting the current height and passing that to styles in order to grow the TextInput component size

This works when I'm changing the content. But when I pass some data to the defaultValue prop then the component doesn't update the height (most of the time).

I want TextInput to also update the height when the initial data is passed to the component.


Solution

  • Fixed the issue by removing the inital value given to descriptionHeight variable.