Masalah utama anu patali jeung activeClassName di React Router nyaéta yén éta henteu otomatis ngamutahirkeun kelas aktip nalika rutena robih. Ieu ngandung harti yén pamekar kudu sacara manual ngamutahirkeun kelas aktip iraha wae ruteu robah, nu bisa jadi consuming waktu jeung rawan kasalahan. Sajaba ti, lamun sababaraha ruteu nu nested dina unggal lianna, éta bisa jadi hésé pikeun ngalacak jalur nu ayeuna aktip tur naon kelas kudu dilarapkeun ka unggal unsur.
<Router> <Link to="/about" activeClassName="active">About</Link> </Router>
1. The
2. The komponén dipaké pikeun nyieun tumbu anu lamun diklik, bakal mawa pamaké ka kaca dieusian dina atribut "ka" (dina hal ieu, "/ ngeunaan").
3. Atribut activeClassName nangtukeun naon kelas kudu dilarapkeun nalika link aktip (dina hal ieu, "aktif").
NavLink mangrupikeun komponén React anu dianggo dina React Router pikeun nyiptakeun tautan navigasi antara rute anu béda dina aplikasi. Éta sami sareng komponén Link, tapi nambihan atribut gaya kana unsur anu didamel nalika cocog sareng URL ayeuna. NavLink ogé nyayogikeun prop activeClassName anu tiasa dianggo pikeun nerapkeun nami kelas nalika rute tautan aktip.
atribut activeClassName
Atribut activeClassName dina React Router dianggo pikeun nangtukeun nami kelas anu bakal diterapkeun kana unsur nalika cocog sareng URL ayeuna. Ieu mangpaat pikeun styling Tumbu atawa item navigasi nalika aranjeunna cocog jalur ayeuna. Éta ogé tiasa dianggo pikeun nambihan gaya tambahan kana elemen anu henteu langsung aya hubunganana sareng rute, sapertos nyorot tab anu ayeuna aktip dina bar navigasi.
Naha ActiveClassName moal jalan
ActiveClassName mangrupikeun fitur React Router anu ngamungkinkeun anjeun pikeun nambihan kelas kana tautan aktip dina ménu navigasi. Hanjakalna, éta moal tiasa dianggo dina React Router sabab ngandelkeun API sajarah browser, anu henteu sayogi dina React Router. Ieu ngandung harti yén React Router teu tiasa ngadeteksi nalika pangguna ngaklik tautan sareng nerapkeun activeClassName sasuai.
