Vue.js je velmi populární knihovna JavaScript, která je známá svou reaktivitou, flexibilitou a intuitivním API. Reaktivita a flexibilita však přicházejí s některými nevýhodami, které vedou k výkonu vývojáře nebo bolesti hlavy. Vypočítaná vlastnost je velmi slavná a nejznámější vlastnost Vue.js, který se používá k aktualizaci nějaké proměnné nebo k provedení nějakého výpočtu v závislosti na aktualizaci jiné proměnné.
Tento příspěvek se pokusí vyřešit problémy, ke kterým došlo, když vypočítaná vlastnost nefunguje, nebo aktualizovat to, co chceme. Pojďme se podívat na scénáře, co se může pokazit a neaktualizuje se Vue Computed Property.
Scénář č. 1:
Nejprve se ujistěte, že jste neudělali žádnou logickou chybu, jako je implementace nesprávné logiky. Abyste se vyhnuli možným logickým chybám, zkontrolujte následující věci:
- Ověřte správnost názvů proměnných.
- O rozsah proměnné se staráte pomocí „this“.
Scénář č. 2:
Druhá věc, kterou jste si ve výpočetní vlastnosti mohli pomýlit, je, že se nestaráte o vedlejší účinky Computed vlastnosti, jako je editace některých dat uvnitř vypočítané vlastnosti nebo volání dalších funkcí. Například obrácení pole v rámci vypočítané vlastnosti.
Předpokládejme, že máme v naší komponentě pole.
data()vrátit se
arrVar: [1,2,3]
,
Ve vypočítané vlastnosti obracíme pole.
vypočteno:arrayReverse ()
vrátit to.arrVar.zvrátit();
Když ale spustíme projekt, zobrazí se chyba 'Neočekávaný vedlejší účinek ve vypočítané vlastnosti „arrayReverse“.„protože bude vždy a znovu dělat stejný úkol a pokaždé obrátí původní pole.
Zkuste se tedy vyhnout manipulaci s daty ve vypočítané vlastnosti a bude to pro vás naprosto v pořádku.
Scénář č. 3:
Dalším scénářem může být to, že vypočítaná vlastnost je zaseknutá v nekonečné smyčce a stále něco přepočítává. Protože vypočítaná vlastnost sleduje každou proměnnou obsaženou ve vypočítané vlastnosti a reaguje nebo se přepočítává při změně jakékoli proměnné zahrnuté v této vlastnosti, pokud změníte stav jakékoli proměnné uvnitř vypočítané vlastnosti, vypočítaná vlastnost detekuje změnu. Začíná se to přepočítávat samo a nebude se moci dostat z této nekonečné smyčky.
Toto jsou některé z možných způsobů, které by mohly vést k tomu, že vypočítaná vlastnost neaktualizuje problém.
Závěr
Tento příspěvek prošel nejběžnějšími scénáři, kterým vývojáři čelili, že se vlastnost Vue Computed neaktualizuje, a poskytl důkladné kroky řešení problémů pro každý scénář. Pokud jste dosud nenašli své řešení, neváhejte se zeptat na komunitní platformy Vue a nechte si na své otázky odpovědět co nejdříve.