1
00:00:00,990 --> 00:00:03,240
Una pregunta muy común para principiantes.

2
00:00:03,240 --> 00:00:07,380
o a veces incluso una pregunta de entrevista es esta,

3
00:00:07,380 --> 00:00:11,220
¿Cuál es la diferencia entre estado y accesorios?

4
00:00:11,220 --> 00:00:14,730
Bueno, en realidad ya aprendimos casi todo.

5
00:00:14,730 --> 00:00:16,590
para responder esa pregunta,

6
00:00:16,590 --> 00:00:19,440
pero aún así hagamos la diferencia entre estado

7
00:00:19,440 --> 00:00:22,440
y accesorios muy claros en esta conferencia,

8
00:00:22,440 --> 00:00:23,730
que también servirá

9
00:00:23,730 --> 00:00:26,523
como un buen resumen de toda esta sección.

10
00:00:28,500 --> 00:00:32,640
Como ya sabemos, el estado son datos internos.

11
00:00:32,640 --> 00:00:34,050
Entonces los datos que son propiedad

12
00:00:34,050 --> 00:00:36,900
por el componente en el que está declarado,

13
00:00:36,900 --> 00:00:38,250
y podemos verlo muy bien

14
00:00:38,250 --> 00:00:42,060
en este pequeño ejemplo con dos componentes.

15
00:00:42,060 --> 00:00:45,780
Ahora, por otro lado, los accesorios son datos externos.

16
00:00:45,780 --> 00:00:48,900
Entonces, los datos que pertenecen al componente principal,

17
00:00:48,900 --> 00:00:52,350
y puedes pensar en los accesorios como parámetros de función.

18
00:00:52,350 --> 00:00:55,260
Entonces, como canal de comunicación entre padres

19
00:00:55,260 --> 00:00:57,840
y componentes secundarios donde los padres

20
00:00:57,840 --> 00:01:00,630
puede pasar datos a los niños.

21
00:01:00,630 --> 00:01:03,030
Por otra parte, se puede pensar en el Estado.

22
00:01:03,030 --> 00:01:04,920
como la memoria del componente

23
00:01:04,920 --> 00:01:07,530
porque puede contener datos a lo largo del tiempo,

24
00:01:07,530 --> 00:01:10,590
entonces en múltiples renderizaciones.

25
00:01:10,590 --> 00:01:14,130
Ahora el estado puede ser actualizado por el propio componente.

26
00:01:14,130 --> 00:01:16,260
y como ya sabemos, esto luego

27
00:01:16,260 --> 00:01:20,220
hacer que React vuelva a renderizar el componente.

28
00:01:20,220 --> 00:01:22,050
Por eso utilizamos este mecanismo.

29
00:01:22,050 --> 00:01:25,440
del estado para hacer que los componentes sean interactivos.

30
00:01:25,440 --> 00:01:28,590
Por otro lado, los accesorios funcionan de manera muy diferente.

31
00:01:28,590 --> 00:01:31,950
Son de sólo lectura, por lo que no se pueden modificar.

32
00:01:31,950 --> 00:01:34,980
por el componente que los recibe.

33
00:01:34,980 --> 00:01:36,930
Sin embargo, y esto es algo

34
00:01:36,930 --> 00:01:38,910
que no hemos aprendido antes,

35
00:01:38,910 --> 00:01:42,960
cuando el componente secundario recibe nuevos accesorios actualizados,

36
00:01:42,960 --> 00:01:46,980
eso en realidad también hará que el componente se vuelva a renderizar,

37
00:01:46,980 --> 00:01:50,970
Y analicémoslo aquí en este ejemplo de código.

38
00:01:50,970 --> 00:01:54,600
Entonces uno de los accesorios que se pasó a cuestionar

39
00:01:54,600 --> 00:01:56,190
se llama "Votos a favor",

40
00:01:56,190 --> 00:01:59,580
y esa variable de votos a favor es en realidad el estado

41
00:01:59,580 --> 00:02:02,040
y el componente principal, ¿verdad?

42
00:02:02,040 --> 00:02:04,560
Se crea usando el gancho useState.

43
00:02:04,560 --> 00:02:08,340
y por lo tanto los votos a favor son de hecho un estado.

44
00:02:08,340 --> 00:02:11,880
Ahora si este pedazo de estado se actualiza, por supuesto.

45
00:02:11,880 --> 00:02:14,370
el componente de la pregunta quién es el dueño del estado

46
00:02:14,370 --> 00:02:15,990
se volverá a renderizar,

47
00:02:15,990 --> 00:02:18,840
pero tiene sentido que el componente hijo

48
00:02:18,840 --> 00:02:22,260
quien básicamente recibe ese estado como apoyo,

49
00:02:22,260 --> 00:02:24,990
También debería volverse a renderizar, ¿verdad?

50
00:02:24,990 --> 00:02:27,990
Porque, ¿de qué otra manera sería el componente del botón?

51
00:02:27,990 --> 00:02:32,283
¿Se mantendrá sincronizado con el estado que recibió como accesorio?

52
00:02:33,210 --> 00:02:36,960
En conclusión, cada vez que se aprueba una parte del estado

53
00:02:36,960 --> 00:02:39,990
como accesorio, cuando ese estado se actualiza,

54
00:02:39,990 --> 00:02:42,540
ambos componentes se vuelven a renderizar.

55
00:02:42,540 --> 00:02:45,180
Entonces, tanto el componente propietario del estado

56
00:02:45,180 --> 00:02:48,630
y el componente recibe el estado como apoyo,

57
00:02:48,630 --> 00:02:52,530
y entonces esta es una conexión muy importante entre el estado

58
00:02:52,530 --> 00:02:55,590
y atrezzo que debes tener en cuenta.

59
00:02:55,590 --> 00:02:59,010
Ahora, finalmente, mientras los desarrolladores utilizan el estado

60
00:02:59,010 --> 00:03:01,170
para hacer que los componentes sean interactivos,

61
00:03:01,170 --> 00:03:04,020
Los accesorios se utilizan para dar el componente principal.

62
00:03:04,020 --> 00:03:07,860
la capacidad de configurar sus componentes secundarios.

63
00:03:07,860 --> 00:03:10,200
Entonces, básicamente, se pueden ver los accesorios.

64
00:03:10,200 --> 00:03:12,780
como configuraciones en componentes secundarios,

65
00:03:12,780 --> 00:03:16,830
que el componente principal puede definir como desee,

66
00:03:16,830 --> 00:03:18,780
y eso es.

67
00:03:18,780 --> 00:03:21,030
Entonces, si alguna vez te preguntan la diferencia

68
00:03:21,030 --> 00:03:23,910
entre estado y utilería en una entrevista de trabajo,

69
00:03:23,910 --> 00:03:26,733
Espero que lo consigas.