1
00:00:02,200 --> 00:00:08,050
Sekarang Anda belajar cara membaca dan memahami pesan panah dan cara menemukan kesalahan logis.

2
00:00:08,050 --> 00:00:12,760
Terkadang Anda ingin mengetahui keadaan saat ini dari aplikasi dan kekayaan reaksi Anda.

3
00:00:12,760 --> 00:00:15,700
Anda mungkin bisa mengetahuinya dengan alat pengembang.

4
00:00:15,700 --> 00:00:17,810
Itu bisa merepotkan.

5
00:00:17,890 --> 00:00:23,080
Untungnya ada ekstensi keren yang dapat Anda tambahkan ke reaksi Chrome D.

6
00:00:23,110 --> 00:00:25,740
Alat Pengembang mari kita instal bersama.

7
00:00:25,900 --> 00:00:32,260
Anda cukup google untuk mereaksi alat pengembang dan Anda akan menemukan repositori github di mana Anda dapat mempelajari

8
00:00:32,260 --> 00:00:38,200
lebih lanjut tentang cara menggunakannya dan bahkan dapat berkontribusi untuk proyek atau Anda memiliki hak untuk

9
00:00:38,200 --> 00:00:39,580
Toko Web Chrome.

10
00:00:39,590 --> 00:00:42,860
Jangan khawatir, ini gratis di Toko Web Chrome.

11
00:00:42,880 --> 00:00:48,260
Saya sudah menambahkannya ke Chrome tetapi Anda dapat mengklik Tambah untuk tumbuh jika Anda belum melakukannya.

12
00:00:48,580 --> 00:00:54,400
Setelah menambahkannya, Anda mungkin harus memulai ulang chrome dan setelah itu di alat pengembang Chrome.

13
00:00:54,400 --> 00:01:00,590
Anda harus menemukan entri antrian di sini komponen dan profiler dengan simbol reaksi ini di sebelahnya.

14
00:01:00,720 --> 00:01:07,720
Dan jika Anda mengklik komponen Anda akan melihat sesuatu seperti tahun ini Anda akan melihat representasi dari komponen

15
00:01:07,760 --> 00:01:10,560
reaksi yang saat ini ditampilkan di layar.

16
00:01:10,600 --> 00:01:15,090
Jadi saat ini ini adalah komponen aplikasi saya di bagian bawah Anda akan melihat alat peraga.

17
00:01:15,100 --> 00:01:16,990
Komponen ini menerima status ujung.

18
00:01:17,020 --> 00:01:19,240
Komponen ini mengelola.

19
00:01:19,240 --> 00:01:23,130
Sekarang jika saya klik toggle people, adakan semuanya untuk melihat semua komponen orang di sini.

20
00:01:23,290 --> 00:01:28,630
Kita semua dapat mengklik pada mereka untuk melihat komponen properti mendapatkan komponen mana yang merendernya dan

21
00:01:28,630 --> 00:01:29,100
seterusnya.

22
00:01:30,140 --> 00:01:36,920
Anda juga dapat mencatat komponen seperti itu ke konsol sehingga Anda dapat melihatnya lebih detail di sini.

23
00:01:36,920 --> 00:01:42,650
Anda juga dapat memeriksa elemen DOM yang cocok yang akan membawa Anda ke tab elemen dan kemudian

24
00:01:42,650 --> 00:01:48,810
menunjukkan kepada kami elemen mana yang diberikan oleh komponen konkret ini dan tentu saja Anda juga dapat memeriksa kode sumber.

25
00:01:48,890 --> 00:01:54,560
Anda dibawa ke sumber karena Taproot dapat melihat breakpoints kobaran api dan sebagainya.

26
00:01:54,600 --> 00:02:00,420
Anda juga dapat pergi ke pengaturan di sini dan men-tweak ini sedikit di sana Anda misalnya dapat

27
00:02:00,420 --> 00:02:03,850
mengubah cara hal-hal ditampilkan dalam cara yang kompak atau nyaman.

28
00:02:03,900 --> 00:02:10,530
Jika Anda memiliki mode terang atau gelap di sini Anda dapat pergi ke komponen khusus dan juga menyorot komponen

29
00:02:10,530 --> 00:02:12,270
tertentu dari jenis tertentu.

30
00:02:12,270 --> 00:02:16,200
Jika Anda ingin tetapi secara umum pengaturan default harus baik-baik saja.

31
00:02:16,200 --> 00:02:21,930
Anda semua dapat menggunakan untuk memilih di sini akan memilih sesuatu di DOM dan secara otomatis memilih komponen reaksi

32
00:02:21,930 --> 00:02:27,780
yang bertanggung jawab untuk merender hal itu sehingga reaksi setelahnya adalah cara yang bagus untuk menyelam lebih dalam ke

33
00:02:27,780 --> 00:02:31,080
ini, tetapi Anda tidak bisa hanya memeriksa hal-hal di sini.

34
00:02:31,080 --> 00:02:32,590
Anak perempuan akan mengubah banyak hal.

35
00:02:32,730 --> 00:02:38,280
Sebagai contoh, mereka dapat mengubah prop usia ke sini dan karenanya di sini kita melihat 30.

36
00:02:38,400 --> 00:02:44,910
Kita tentu saja dapat juga mengubah status dan mengatur ini ke false dan memiliki efek yang sama seperti jika kita

37
00:02:44,970 --> 00:02:46,170
mengklik tombol sakelar.

38
00:02:46,260 --> 00:02:51,990
Jadi ini adalah tempat yang bagus untuk bermain-main dengan komponen Anda menguji berbagai keadaan dan alat peraga

39
00:02:51,990 --> 00:02:58,080
dengan mudah tanpa harus menyulitkan kode apa pun dalam kode Anda dan itu semua bagus untuk memeriksa apa yang

40
00:02:58,080 --> 00:03:03,910
Anda miliki di layar dan memahami apa yang ditampilkan di sana dan mengapa dan bagaimana segala sesuatu bekerja sama.