1
00:00:02,320 --> 00:00:09,040
Quindi, ora che il componente dell'articolo del prodotto è stato riorganizzato, è ora di poter dire di eliminare

2
00:00:09,040 --> 00:00:14,120
gli articoli perché è effettivamente tra le cose più semplici che possiamo fare.

3
00:00:14,170 --> 00:00:19,600
Questo ci riporta a Redux e lì, ora è il momento di lavorare sui prodotti e

4
00:00:19,600 --> 00:00:21,120
inizierò le azioni che

5
00:00:21,160 --> 00:00:26,450
attualmente è un file vuoto, i prodotti. File js nella cartella delle azioni

6
00:00:26,560 --> 00:00:35,350
in cui desidero esportare un'azione che ci aiuta a eliminare i prodotti. L'identificatore quindi si chiama semplicemente elimina prodotto e contiene un

7
00:00:35,350 --> 00:00:46,900
testo di eliminazione del prodotto qui ed esporterò anche un creatore di azioni elimina prodotto che accetta l'ID prodotto, come questo e che quindi restituisce un oggetto

8
00:00:46,900 --> 00:00:53,430
azione in cui il tipo è elimina prodotto e il pid, l'ID prodotto è semplicemente l'ID

9
00:00:53,440 --> 00:00:55,990
prodotto inoltrato, in questo modo.

10
00:00:59,620 --> 00:01:07,990
Ora nel riduttore, nel file dei riduttori dei prodotti, possiamo ascoltarlo perché al momento

11
00:01:08,560 --> 00:01:17,110
non ci preoccupiamo mai di nessuna azione. Ora possiamo attivare il tipo di azione qui e gestire il caso in cui si tratta di eliminare il prodotto che

12
00:01:17,230 --> 00:01:23,900
otteniamo dal nostro file di azione dei prodotti e quindi è necessario aggiungere tale importazione. In questo caso, è necessario rimuovere il

13
00:01:23,900 --> 00:01:29,840
prodotto dall'array di prodotti dell'utente e, naturalmente, anche dall'array di prodotti disponibili perché viene

14
00:01:29,840 --> 00:01:34,490
eliminato in generale, non solo nei nostri prodotti utente ma dall'intera

15
00:01:34,490 --> 00:01:35,290
app.

16
00:01:37,990 --> 00:01:39,190
Quindi qui,

17
00:01:39,190 --> 00:01:48,100
restituirò un nuovo oggetto in cui copiamo lo stato esistente per essere sicuri che non perdiamo alcuno stato e ora i prodotti

18
00:01:48,100 --> 00:01:51,630
dell'utente sono semplicemente stato. userProducts, quindi i vecchi

19
00:01:51,640 --> 00:01:57,070
prodotti utente su cui possiamo filtrare, questo è un metodo Javascript incorporato che restituisce

20
00:01:57,070 --> 00:02:04,640
un nuovo array, un nuovo array che fondamentalmente viene creato eseguendo una funzione su ogni elemento nel vecchio array e

21
00:02:04,660 --> 00:02:09,930
se tale funzione restituisce true , manteniamo quell'elemento, se restituisce false lasciamo cadere l'articolo.

22
00:02:10,000 --> 00:02:15,490
Quindi questo esegue una funzione in cui otteniamo il prodotto, questa funzione viene eseguita per noi da

23
00:02:15,490 --> 00:02:20,720
Javascript per così dire e passa nell'elemento che sta attualmente dando un'occhiata a questa funzione.

24
00:02:20,800 --> 00:02:29,110
Quindi otteniamo il prodotto per ogni prodotto nel nostro array di prodotti utente e vogliamo restituire l'ID prodotto, a differenza

25
00:02:29,650 --> 00:02:33,390
dell'azione pid che è l'ID prodotto che vogliamo eliminare.

26
00:02:33,400 --> 00:02:39,530
Ciò significa che fondamentalmente manterrà tutti i prodotti in cui gli ID non corrispondono, se corrispondono, sappiamo che

27
00:02:39,550 --> 00:02:41,890
è il prodotto di cui vogliamo sbarazzarci

28
00:02:41,890 --> 00:02:43,240
e quindi restituiamo

29
00:02:43,240 --> 00:02:46,340
falso che significa nel nuovo array, non sarà incluso.

30
00:02:46,370 --> 00:02:50,890
Ora è essenzialmente la stessa logica per i prodotti disponibili, non

31
00:02:50,900 --> 00:02:55,530
ci resta che esaminare tutti i prodotti disponibili e filtrare lì il prodotto.

32
00:02:55,550 --> 00:03:01,090
Questa è una modifica che dobbiamo apportare, un'altra modifica deve essere apportata nel carrello, tuttavia,

33
00:03:01,090 --> 00:03:06,400
poiché quando eliminiamo un prodotto, è necessario rimuoverlo anche dal carrello perché altrimenti abbiamo un

34
00:03:06,400 --> 00:03:09,690
prodotto nel carrello che non esiste più .

35
00:03:09,820 --> 00:03:17,410
Quindi qui aggiungerò anche un caso per eliminare il prodotto e quindi è necessario importare il prodotto di eliminazione dai prodotti di azioni

36
00:03:17,410 --> 00:03:18,810
nel carrello. Anche

37
00:03:18,820 --> 00:03:20,290
js riduzione e qui,

38
00:03:23,060 --> 00:03:27,830
dobbiamo assicurarci di rimuovere il prodotto dal carrello se è stato eliminato.

39
00:03:29,670 --> 00:03:36,150
Quindi qui nel carrello, ovviamente otteniamo il nostro ID prodotto del prodotto che vogliamo

40
00:03:36,300 --> 00:03:47,940
eliminare, è questo pid in quell'azione che viene spedito, quindi qui restituiamo un nuovo stato in cui vogliamo aggiornare il nostro carrello e l'importo totale

41
00:03:47,950 --> 00:03:53,680
tale che il prodotto è sparito e sparito, intendo totalmente cancellato dal carrello,

42
00:03:53,680 --> 00:04:01,920
non solo ridotto di uno ma totalmente cancellato. Quindi alla fine gli articoli sono una copia

43
00:04:01,920 --> 00:04:02,760
degli

44
00:04:02,760 --> 00:04:12,610
articoli esistenti senza quel prodotto, quindi creerò una nuova costante, articoli aggiornati in cui copio i miei articoli di stato

45
00:04:12,610 --> 00:04:13,910
esistenti qui, come

46
00:04:15,010 --> 00:04:22,820
questo e quindi elimino gli articoli aggiornati per l'azione pid, quindi elimino questo articolo dal carrello.

47
00:04:22,820 --> 00:04:29,600
Naturalmente questo ha senso solo se questo articolo esiste nel carrello, quindi prima di tutto verificherò se dichiarare articoli per

48
00:04:29,750 --> 00:04:33,940
azione pid, se restituisce qualcosa di significativo e se non è

49
00:04:34,220 --> 00:04:40,310
il caso, allora restituirò semplicemente lo stato esistente perché poi ho finito con questo caso, non ho

50
00:04:40,310 --> 00:04:44,750
bisogno di cambiare nulla nello stato, quindi restituirò lo stato esistente senza modifiche.

51
00:04:45,230 --> 00:04:46,840
Se riesco a superare

52
00:04:46,850 --> 00:04:52,330
questo controllo, quindi so che il prodotto con l'ID che stiamo per eliminare fa parte dell'articolo.

53
00:04:52,340 --> 00:05:00,790
Quindi quindi continuo a copiare i miei articoli, quindi elimino il prodotto da lì, ma prima

54
00:05:00,790 --> 00:05:11,970
di farlo, ottengo il totale dell'articolo accedendo agli articoli di stato per l'azione pid e quindi lì, ovviamente abbiamo questo, se diamo

55
00:05:11,970 --> 00:05:20,150
un'occhiata al carrello modello di articolo Voglio dire, abbiamo questo campo somma qui, quindi alla

56
00:05:20,150 --> 00:05:27,300
fine qui devo rimuovere la somma. Sono interessato alla somma perché ora posso aggiornare i miei

57
00:05:27,300 --> 00:05:34,440
articoli laggiù con gli articoli aggiornati in cui l'ho eliminato con la parola chiave delete e l'importo totale del carrello è lo stato

58
00:05:34,620 --> 00:05:44,540
totale meno il totale dell'articolo, quindi il totale di questo carrello oggetto che avevamo aggiunto prima. Quindi ora aggiorniamo il carrello in modo

59
00:05:44,540 --> 00:05:45,760
appropriato

60
00:05:45,860 --> 00:05:50,600
anche quando lo eliminiamo. Ora dobbiamo solo inviare questa

61
00:05:50,660 --> 00:05:52,960
eliminazione, quindi torniamo ai

62
00:05:52,990 --> 00:06:00,170
prodotti degli utenti, qui in eliminazione, vogliamo spedire. Quindi da React Redux possiamo importare use dispatch

63
00:06:00,170 --> 00:06:04,140
per ottenere l'accesso alla funzione di spedizione qui chiamando

64
00:06:04,490 --> 00:06:12,290
use dispatch come abbiamo fatto molte volte prima e poi qui, quando si preme delete, possiamo spedire la

65
00:06:12,290 --> 00:06:12,980
nostra

66
00:06:12,980 --> 00:06:13,870
azione e

67
00:06:13,880 --> 00:06:24,130
per quello, ovviamente, abbiamo bisogno per importare questa azione, quindi facciamolo, importiamo forse tutto come azioni dei prodotti dalla cartella del negozio, lì dalla

68
00:06:24,160 --> 00:06:29,650
cartella delle azioni e lì dal file dei prodotti e ora usiamo l'azione

69
00:06:29,650 --> 00:06:36,100
dei prodotti laggiù quando spediamo questo per chiamare elimina prodotto e inoltra l'ID prodotto che

70
00:06:36,100 --> 00:06:40,340
ovviamente è itemData. articolo. Id qui perché stiamo

71
00:06:40,480 --> 00:06:46,830
esaminando tutti i prodotti qui e ciò significa sostanzialmente che ItemData. l'articolo fa riferimento alle istanze del nostro modello

72
00:06:46,840 --> 00:06:51,870
di prodotto, ogni istanza ha una proprietà ID e la inoltriamo per eliminare il prodotto.

73
00:06:51,940 --> 00:06:58,900
Quindi, se ci proviamo e andiamo all'amministratore e faccio clic su Elimina sulla maglietta rossa, in effetti è andata qui e

74
00:06:58,900 --> 00:07:01,960
se torno ai prodotti, è andata anche qui.

75
00:07:02,200 --> 00:07:08,680
Ora se ricarichiamo questo e aggiungo la maglietta rossa al carrello, la vedi qui, l'ho aggiunta due volte.

76
00:07:08,680 --> 00:07:16,380
Ora se vado all'amministratore e lo elimino e torno ai prodotti e al carrello, il carrello è vuoto ora.

77
00:07:16,520 --> 00:07:23,090
D'altra parte, se aggiungo diciamo ora il tappeto e la tazza di caffè, torna all'amministratore, elimina

78
00:07:23,090 --> 00:07:28,460
il tappeto ma non la tazza di caffè, vedi nei prodotti, la tazza

79
00:07:28,520 --> 00:07:35,850
di caffè è ancora nel carrello, quindi opera. A proposito, potresti notare che la tazza di caffè è un po 'tagliata qui,

80
00:07:35,880 --> 00:07:41,240
è qualcosa che riparerò più tardi insieme al fatto che qui, in realtà, vediamo un segno negativo ora per il totale,

81
00:07:41,250 --> 00:07:43,680
è anche qualcosa che risolverò in un secondo.

82
00:07:43,680 --> 00:07:45,810
Prima di tutto assicuriamoci che nella

83
00:07:45,840 --> 00:07:52,830
sezione admin possiamo comunque accedere alla schermata di modifica o che abbiamo anche un elemento lassù che ci consente di

84
00:07:52,830 --> 00:07:54,720
aggiungere un nuovo prodotto.