Subscribe on changes!

Vue reactivity breaks custom array implementations (proxy on arrays, classes extending Array, array-like classes)

avatar
Oct 6th 2020

Version

3.0.0

Reproduction link

https://codepen.io/rohmori/pen/zYBOeyv?editors=1010

Steps to reproduce

Click "Say hello". Note that the alert says "hello world" (the "world" string is coming from the array proxy). Also note that the page header changes to "Proxy works!".

Now click "Say hello wrapped by vue ref". Note that the proxy array is being bypassed so the code does not run and the "world" is not returned from the pop function.

What is expected?

The vue ref should pass calls on array functions through to the underlying array

What is actually happening?

The vue ref bypasses the underlying array and calls the functions on the Array.prototype instead.


We use proxies extensively in our project and expect vue to pass calls and property accesses through to the underlying objects in all cases

avatar
Oct 6th 2020

I created this PR, which fixes the issue in my local project https://github.com/vuejs/vue-next/pull/2315