Vue version

3.3.11

Link to minimal reproduction

https://stackblitz.com/~/github.com/Msg-Lbo/bugDemo

Steps to reproduce

1:点击右侧文件夹按钮选择mp3 2:确认选择

1:Click the folder button on the right to select mp3 2:Confirm selection

What is expected?

播放按钮左侧显示出mp3总时间 The total time of the mp3 is displayed on the left side of the play button

What is actually happening?

在devTools中能够发现musicTime_total发生了变化,但这里使用computed却无法响应式获取 It can be found in devTools that musicTime_total has changed, but it cannot be obtained responsively using computed here.

System Info

No response

Any additional comments?

如果将myAudio.ts中的setMusicTime_total换成普通函数,并按照复现步骤操作,会发现正确的显示了MP3的总时间.我不知道为什么,请告诉我,谢谢 If you replace setMusicTime_total in myAudio.ts with a normal function and follow the steps to reproduce, you will find that the total time of MP3 is correctly displayed.I don't know why, please tell me, thank you

这不是 bug

• https://cn.vuejs.org/guide/extras/reactivity-in-depth.html#how-reactivity-works-in-vue
• https://cn.vuejs.org/guide/essentials/reactivity-fundamentals.html#declaring-methods:~:text=%E4%BD%A0%E4%B8%8D%E5%BA%94%E8%AF%A5%E5%9C%A8%E5%AE%9A%E4%B9%89%20methods%20%E6%97%B6%E4%BD%BF%E7%94%A8%E7%AE%AD%E5%A4%B4%E5%87%BD%E6%95%B0%EF%BC%8C%E5%9B%A0%E4%B8%BA%E7%AE%AD%E5%A4%B4%E5%87%BD%E6%95%B0%E6%B2%A1%E6%9C%89%E8%87%AA%E5%B7%B1%E7%9A%84%20this%20%E4%B8%8A%E4%B8%8B%E6%96%87%E3%80%82 Vue 的响应性实现靠的是 Proxy，需要劫持 this 指向。 如果你用箭头函数的话，这个函数的 this 是指向其创建时的闭包里的 this，不会在运行时改变，所以无法产生响应性。