如何修复每个按钮将显示不同的文本

时间:2019-07-20 00:40:53

标签: react-native

我正在安装一些软件。我正在使用按钮,并且我尝试每个按钮将显示不同的文字侧,即使单击了相同的按钮,也将在其上写入相同的文本,而每个按钮彼此的点击次数都将计算在内

这是一个反应性项目

import React, { Component } from 'react';
import { StyleSheet, Text, View ,ScrollView ,Button} from 'react-native';

export default class App extends Component<{}> {

  constructor(){ (here constructor)
    super();
    this.state = {

    textValue: '',
    textCal: 0,
    textTotal:'',
    count: 0,

    }

    this.onPressButton= this.onPressButton.bind(this);
          }

     (Here button functiom)
    onPressButton(event,urnName,urnPrice) {
    this.setState({

        count: this.state.count + 1,
        textValue: urnName,
        textCal :urnPrice * (this.state.count + 1),
        textTotal:urnPrice * (this.state.count + 1),

    })
  }


  render(){
  return (

    <View style={styles.container}>


            <View style={styles.Box}>

              <Text style={{color:    'red',fontSize:20,textAlign:"center"}}> {this.state.count} {this.state.textValue} {this.state.textCal} </Text>
              <Text style={{color: 'red',fontSize:20}}> {this.state.textTotal} </Text>


            </View>


          <ScrollView style={styles.Box}>
            <View style={styles.Element2}>

            <Button title= 'Pizza' onPress={(event) => this.onPressButton(event, "Pizza Polo",6.5)}/>

            </View>
            <View style={styles.Element2}>
            <Button title= 'Hamburger' onPress={(event) =>   this.onPressButton2(event, "Hamburger", 5.5)}/>

            </View>

我没有收到任何错误消息。当我单击显示不同名称的钱的不同按钮,但计数器2的按钮计数相同,并且单击第二个按钮的文本顶部的其他按钮时,我会这样做

0 个答案:

没有答案