Tuotteen tieto-objektin luominen Reduxissa

Funktio myyjän objektin luomiseen meillä on, siirrytään tuotteeseen. Tämän objektin luominen on hieman monimutkaisempaa, koska se sisältää enemmän kenttiä tietoineen. Aloitetaan.

Avataan tuotesovelluksemme, ja siinä tiedosto server.js. Alempana funktion getRandInt jälkeen kirjoitetaan funktiomme createProductData:

api/server.jsconst createProductData = () => {}

Nyt määritellään tarvitsemamme ominaisuudet. Arvot kentille name, price ja amount luomme getRandInt -funktion avulla, jonka kirjoitimme edellisellä oppitunnilla:

api/server.jsconst createProductData = () => {
  return {
    name: `Product${getRandInt(0, 100)}`,
    price: getRandInt(100, 2000),
    amount: getRandInt(1, 50),
  }
}

Ja kuvauksen generoimiseksi hyödynnämme toista hyödyllistä työkalua. Tämä on kirjasto faker, joka mahdollistaa feikkien nimien, osoitteiden, sähköpostien, katujen nimien, tekstien jne. generoinnin erilaisilla kielillä. Annetaan terminaalissa seuraava komento ja asennetaan tämä kirjasto sovelluksellemme:

terminalnpm install @faker-js/faker --save-dev

Ja sitten importataan se tiedostoomme:

api/server.jsimport { faker } from '@faker-js/faker'

Hyödynnetään sen lauseiden generointia, jotka sisältävät tunnetun "lorem ipsum" -tekstin 'Lorem ipsum'. Olkoon kuvaus 3:sta 5:een tällaista lausetta:

api/server.jsconst createProductData = () => {
  return {
    name: `Product${getRandInt(0, 100)}`,
    desc: faker.lorem.sentences({ min: 3, max: 5 }),
    price: getRandInt(100, 2000),
    amount: getRandInt(1, 50),
  }
}

Nyt lisätään objektiimme kenttä reaktioille, annamme sen arvoksi paikalla create -komennolla generoidun objektin (reaktiot ovat siellä toistaiseksi 0):

api/server.jsconst createProductData = () => {
  return {
    name: `Product${getRandInt(0, 100)}`,
    desc: faker.lorem.sentences({ min: 3, max: 5 }),
    price: getRandInt(100, 2000),
    amount: getRandInt(1, 50),
    reactions: db.reaction.create(),
  }
}

Ja viimeisenä ominaisuutena lisätään jo generoitu myyjän objekti, joka on välitettävä parametrina funktiolle createProductData. Tältä tuotteen objektin luomisfunktion täydellinen koodi näyttää:

api/server.jsconst createProductData = (seller) => {
  return {
    name: `Product${getRandInt(0, 100)}`,
    desc: faker.lorem.sentences({ min: 3, max: 5 }),
    price: getRandInt(100, 2000),
    amount: getRandInt(1, 50),
    reactions: db.reaction.create(),
    seller,
  }
}