"Cannot update during an existing state transition" error in React

Your solution does not work because it doesn't make sense logically. The error you receive may be a bit vague, so let me break it down. The first line states:

Cannot update during an existing state transition (such as within render or another component's constructor).

Whenever a React Component's state is updated, the component is rerendered to the DOM. In this case, there's an error because you are attempting to call overflowAlert inside render, which calls setState. That means you are attempting to update state in render which will in then call render and overflowAlert and update state and call render again, etc. leading to an infinite loop. The error is telling you that you are trying to update state as a consequence of updating state in the first place, leading to a loop. This is why this is not allowed.

Instead, take another approach and remember what you're trying to accomplish. Are you attempting to give a warning to the user when they input text? If that's the case, set overflowAlert as an event handler of an input. That way, state will be updated when an input event happens, and the component will be rerendered.

Make sure you are using proper expression. For example, using:

<View onPress={this.props.navigation.navigate('Page1')} />

is different with

<View onPress={ () => this.props.navigation.navigate('Page1')} />

or

<View onPress={ () => {
    this.props.navigation.navigate('Page1')
}} />

The two last above are function expression, the first one is not. Make sure you are passing function object to function expression () => {}