在显示语法错误时尝试创建此号码转换器

人气:957 发布:2022-10-16 标签: react-native react-native-android react-native-ios expo native-base

问题描述

我正在尝试使用此函数来增加和减少输入数字,同时它显示出意外的语法错误.这段代码有什么问题:

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?

推荐答案

试试这个代码

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>
    )
  }
}

我使用的必要进口是:

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

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

122