vue.jsvuejs3

Avoid app logic that relies on enumerating keys on a component instance


in my complex Vue project I am getting this console warning:

[Vue warn]: Avoid app logic that relies on enumerating keys on a component instance. The keys will be empty in production mode to avoid performance overhead.

Unfortunately I can not find the reason for this warning just by the above message.

How can I track down the reason for this warning?


Solution

  • Check if you're watching an entire route object anywhere in your code. Doing so throws that warning (in my case).

    Refer this vue documentation on watching routes Accessing router and current route inside setup

    The route object is a reactive object, so any of its properties can be watched and you should avoid watching the whole route object. In most scenarios, you should directly watch the param you are expecting to change.