Subscribe on changes!

reactive处理响应对象的bug

avatar
Jun 3rd 2023

Vue version

3.3.4

Link to minimal reproduction

https://play.vuejs.org/#eNq1VU1vozAQ/SsWl6ZSmvBlCG5SaaVee9tbycECJ0ELGIGJNkL89x3bIYWQJuyhBCn4eTzveWbsaYxfRbE41swgxrqKyqQQqGKiLt7CHCVZwUuBGlQyGonkyOaI5x+8zgWLW7QreYaeYOkTQgiswzxlAsVM0CRFm27J7HP7/KqnUMpp/MFzcXinglYbNHvevDVyqX6kTcmqAm1QExoRj1loENs04Z2HRsaqiu4lFBpVHUUwDA3AdyndAyjKmsEoBs8wgvWZJFLWtmk7LyZW1loewJ9gEtOTZHABT/KIZ+w3F1ROBj5A7G/B8riDbAsr96f3vgehuEMjZbTMFYE4FVpjceA5fMlFXCSZBi2P2A6xPYVXgooaNgG45lIozWSAAcVuO+9RiJIeGfD2OcDDbnfNYfrEceCdwhEMOfZU+ugzsNNoD6ZJsE2wP8W/5z/cw4HRWMVKp7MfLEzcgGDrmkjn6mojfrtVVDqn1mqUU1lDw5S69zJaHXhxFewO6Um0LYJNYk3Kp4uHEr2RRKV6qFGq/k7i9IqQUSTWpEBaq6FKZ6QSjw/H/6q8fTYcYno36vaWSjxMdzAh27YldX+rkqXsS9Xd8ofjtSKWOynlwaD8xzV1p/h9Yq4IDqbQ+M7DU5bRUe1CvG0f3ikMK/vBPRHBbQsX/ihYrryLsDmFw3IGObVHOfXlifmJ4+ETiLYzyuitwvM9ELltW2hp5651+bi0PtXEFrITLTT0+mUEcap4yhYp38+6boSAQn/JTtmGufxdGu1Mdcmzg2EHnSn7Z9V710vdvaFvw0CwrEipYLKLo3Wdqn941mmCji87Xm5ge2CEkvwsOzQQ+cNO6DwB8iEJ3TJ4mqaDW1ConS3TRBMsFcN6eaE12n8mxK3v

Steps to reproduce

What is expected?

detail Proxy(Array) {0: {…}, 1: {…}}

What is actually happening?

detail (5) [{…}, {…}, {…}, {…}, {…}]

System Info

win11,chrome

Any additional comments?

如果不是Proxy(Array)视图界面就无法实现自动的刷新。控制台异常 [Vue warn]: Unhandled error during execution of scheduler flush. This is likely a Vue internals bug. Please open an issue at https://new-issue.vuejs.org/?repo=vuejs/core at at at at at at at at

avatar
Jun 3rd 2023

@haorenJava

Not getting [Vue warn] in the console after opening 'minimal reproduction' link.

detail = resp.data.detail; 

Here, you are assigning new variable to detail which not reactive hence you are not getting expected result. Just incase you want reactivity you can use detail = reactive(resp.data.detail) to get expected output.

But, This is not a bug.

avatar
Jun 4th 2023

看上去不像一个bug,而是使用方式不太对,这样直接替换对象,本质上没有对原先数组进行操作,因此不会触发更新

avatar
Jun 5th 2023

reactive() does not manipulate the original data inot a proxy.