Balance-arvon laskeminen

Tarkkaavaisimmat huomasivat, että pääsivun sitruunoiden määrä ei täsmää alisivujen sitruunoiden määrän kanssa. Tämä johtuu siitä, että etusivulla tulostetaan todellisuudessa napautusten lukumäärä, joka myöhemmissä vaiheissa ei ole sama kuin kassassa olevien sitruunoiden lukumäärä. Alisivuilla sitruunoiden määrä ei tulostu, koska balance-arvoa ei vielä lasketa. Lisätään seuraavaksi sen laskukaava ja käytetään laskettua arvoa pääsivulla.

  1. Avaa src-kansion App.jsx-tiedosto ja lisää handleClick-funktion toisiksi viimeisiksi koodiriveiksi seuraavat rivit:

        // Kasvataan sitruunoiden määrää kasvatusarvolla.
        newstats.balance = newstats.balance + newstats.increase;
    

    Huomaa, että setStats-funktion kutsu pitää jäädä viimeiseksi, sillä sen jälkeen tehdyt muutokset eivät tallennu tilamuuttujaan.

  2. Korjataan vielä pääsivulla näkymään kassasssa olevien sitruunoiden määrä napausten sijasta. Avaa src/pages-kansion Clicker.jsx-tiedosto ja muuta Balance-komponentin kutsu seuraavanlaiseksi:

          <Balance total={props.stats.balance} />
    

Näiden muutosten jälkeen balance-arvo lasketaan ja se näkyy sekä pääsivulla että alisivuilla.

Sitruunoiden määrä näkyy pääsivulla

Sitruunoiden määrä näkyy alisivulla

Muutosten vienti versiohallintaan

Viedään viimeisimmät muutokset versiohallintaan.

git add .
git commit -m "lisää balance-arvon laskennan"

lisää balance-arvon laskennan -commit