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:

const createProductData = () => {}

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

const 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:

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

Ja sitten importataan se tiedostoomme:

import { 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:

const 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):

const 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ää:

const 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,
	}
}

Avaa opiskelijasovelluksesi. Tutkittuasi tämän oppitunnin materiaalin, kirjoita funktio opiskelijan tieto-objektin luomiseksi.