Nsryjdtyk

I have a component where I display a button when certain conditions are met (based on component state)

{

      this.state.inputTag !== null && this.state.inputTagFocused ? (

        <TouchableOpacity 

          style = {{backgroundColor : Colors.primary, padding : 15, paddingBottom : 5, paddingTop : 5, borderRadius: 2}}

          onPress = {this.handleAddTags}

        >

          <Text style = {{fontFamily : Fonts.primary, color : Colors.white}}>Add</Text>

        </TouchableOpacity>

      ) : null

    }

Using TextInput component I am updating the state like this

<TextInput

  style = {{ borderBottomColor : Colors.grey, padding : 15, paddingLeft :0, paddingRight : 0, marginRight : 15}}

  onChange = {(text)=> this.setState({inputTag : text})}

  onFocus = {() => this.setState({inputTagFocused : true})}

  placeholderTextColor = {Colors.grey}

  ref = {(tags) => {this.tags = tags}}

  underlineColorAndroid = 'transparent'

  placeholder = 'Add Tags'

  returnKeyType = 'done'

  multiline = {false}

/>

Everything seems to work except when I press the add button the whole app crashes and after few minutes I get the error of 'out of memory'.

What is causing the issue? and how can I solve it?

the full code can be found here

Try replacing , with + in your console.log()