Question

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

     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>

   );
  }
}

很显然，这不是与封装标签或与之相关的错误。 } 由于未显示任何提及的错误。它只是表示意外错误。我们如何使此代码起作用？

Answer 1

尝试此代码

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'

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

1 个答案: