Trying to create this number changer while shows syntax error

Question

I am trying to use this functions to increment and decrement input number while it's showing unexpected syntax error. What is wrong in this code:

     constructor(props) {
        super(props);
        this.state = {
          textValue:1


        };
      }

    updateText: function (text) {
    this.setState({textValue: +text});
    },

    decrement: function () {
    this.setState({textValue: this.state.textValue - 1});
    },

    increment: function () {
    this.setState({textValue: this.state.textValue + 1});
    },

   render() {
    return (
    ...
    ...
              <View style={styles.view}>
                <Button bordered style={styles.button} onPress={this.decrement}>
                <Text style={{color:'#000000'}}> - </Text>
                </Button>
     <Item style={styles.input} regular>
                <Input
        keyboardType='number-pad'
        value={this.state.textValue.toString()}
        onChangeText={this.updateText}
     placeholder='1' />
              </Item>
     <Button bordered style={styles.button} onPress={this.increment}>
                <Text style={{color:'#000000'}}> + </Text>
                </Button>
             <Button style={styles.button}>
                <Icon name="cart" style={{color: secondary}} />
                </Button>

   );
  }
}

Obviously, it's not an error connected with enclosing tag or with,; } Since it's not showing any of the mentioned errors. It just says unexpected error. How can we make this code work?

score 0 · Accepted Answer · answered Jul 09 '18 at 13:16

Try this code

constructor(props) {
    super(props)

    this.state = {
        textValue: 1
    };
}



decrement() {
    this.setState({ textValue: this.state.textValue - 1 });
}

increment() {
    this.setState({ textValue: parseInt(this.state.textValue) +  1});
}




render() {
    return (
        <View style={styles.view}>
            <TouchableOpacity bordered style={styles.button} onPress={() => this.decrement()}>
                <Text style={{ color: '#000000' }}> - </Text>
            </TouchableOpacity>

            <TextInput
                keyboardType="numeric"
                value={this.state.textValue + ""}
                onChangeText={(text) => this.setState({ textValue: text })}
                placeholder='1' />

            <TouchableOpacity style={styles.button} onPress={() => this.increment()}>
                <Text style={{ color: '#000000' }}> + </Text>
            </TouchableOpacity>

            <TouchableOpacity style={styles.button}>
                <Icon name="cart" style = {{ color: secondary }} />
            </TouchableOpacity>
        </View>
    )
  }
}

Necessary import i have use are :

import React, { Component } from 'react';
import {
  StyleSheet,
  View,
  Text,
  Icon,
  TouchableOpacity,
  TextInput
 } from 'react-native';

import { Icon } from 'react-native-elements'

Trying to create this number changer while shows syntax error

1 Answers1

Linked