Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/431.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/reactjs/24.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 在React中计算总价_Javascript_Reactjs_Oop_Components_Calculator - Fatal编程技术网

Javascript 在React中计算总价

Javascript 在React中计算总价,javascript,reactjs,oop,components,calculator,Javascript,Reactjs,Oop,Components,Calculator,这是我第一次尝试用React。 我得计算一下预订的(总)价格 预订价格由以下几个因素决定: 船长:每米1.25欧元 人数:每人1欧元 用电:每天1.25欧元 假设这艘船有10米长,船上有两个人在用电。他们呆了两天。计算如下所示: 船长(10)*1.25*2=25 人数(2)*1*2=4 使用电量(真实)=1.25*2=2.5 总价=25欧元+4欧元+2.5欧元=21.5欧元 我尝试在代码中实现这一点,如下所示: import React, { Component } from 'reac

这是我第一次尝试用React。 我得计算一下预订的(总)价格

预订价格由以下几个因素决定:

  • 船长:每米1.25欧元
  • 人数:每人1欧元
  • 用电:每天1.25欧元
假设这艘船有10米长,船上有两个人在用电。他们呆了两天。计算如下所示:

  • 船长(10)*1.25*2=25
  • 人数(2)*1*2=4
  • 使用电量(真实)=1.25*2=2.5
  • 总价=25欧元+4欧元+2.5欧元=21.5欧元
我尝试在代码中实现这一点,如下所示:

import React, { Component } from 'react'
import BoatForm from "./BoatForm";
import StayForm from "./StayForm";

export default class PriceCalculator extends Component {
    /**
     * So, we created a form for the customers so that they can register their boat.
     * Now we want to let them know how much their reservation costs.
     * The size of the boat, amount of people, amount of days and use of electricity are all parameters.
     */

    constructor(props) {
        super(props)
        this.state = {
            boat_length: '',
            amount_of_people: '',
            arrival_date: '',
            leave_date: '',
            use_of_electricity: '',
            box_number: ''
        }
    }

    /**
     * We use date fields in our form to define the stay date of the customer.
     * That means we have to calculate the days ourselves.
     */

    calculateStayTime() {
        const ArrivalDate = new Date(this.state.arrival_date);
        const LeaveDate = new Date(this.state.leave_date);
        // calculate difference
        const DiffTime = Math.abs(LeaveDate - ArrivalDate);
        const DiffDays = Math.ceil(DiffTime / (1000 * 60 * 60 * 24));
        let AmountOfDays = DiffDays;
        return AmountOfDays;
    }

    /**
     *  Prices per day:
     *  - Price per meter: 1,25
     *  - Price per person: 1
     *  - Price for using electricity: 1,25
     */

    calculatePrice() {
        const BoatLength = this.state.boat_length;
        const meter_price = 1.25;
        const Persons = this.state.amount_of_people;
        const persons_price = 1;

        let price_per_day = BoatLength * meter_price + Persons * persons_price;


        const electricity_price = 1.25;
        const use_of_electricity = true;
        // ? = if statement
        price_per_day = price_per_day + (use_of_electricity ? electricity_price : 0);
        // const total_price = price_per_day * AmountOfDays;
    }

}

我很难将变量从calculateStatime()传递到calculatePrice()。有谁能帮我制定React.JS的计算公式吗?

您需要在
calculatePrice
中使用
CalculateTime
的结果。您可以将停留时间值指定给变量,但我可能只替换最后一行:
//const total\u price=price\u per\u day*AmountOfDays可以替换为
const total_price=price_per_day*this.calculatesTime()
应该提供您所需的信息。

您需要在
calculatePrice
中使用
calculatetime
的结果。您可以将停留时间值指定给变量,但我可能只替换最后一行:
//const total\u price=price\u per\u day*AmountOfDays可以替换为
const total_price=price_per_day*this.calculatesTime()它应该能满足您的需要。

谢谢!这确实有帮助。现在时间与价格挂钩:)@epnic如果解决了您的问题,请接受答案:)谢谢!这确实有帮助。现在时间与价格挂钩:)@epnic如果解决了您的问题,请接受答案:)