When using Non Ascii alias for list items in v-for directive, event handling is not working as expected.

[H4M4CHi-ttr]

Vue version

3.2.37

Link to minimal reproduction

https://sfc.vuejs.org/#eNqdUktOwzAQvcrgTanUxPuSVhR2LOAAmIWbTovbxLFspwhFOQB3QOy5GFyDcT6lfAqIRJHm++a9yVRsZky8LZGNWeJSq4wHh740U6GFTwvtPCyzUnkHE7geXFmpVzgYwYDassY4k5rewc2J0ADhW5Y69arQUOjzTKWbYzeEKiTCIzO0niJNdS10wtuhYZxOPOYmkx7JA0gWatsYH0xyzHTmUqUSHkh2sTLb2eRlCrbRsrATwRryoHSnQjAYb/C+Twi210aN89J7Yn6aBuJU1EtoiodUXVUtENR1wtvq/cE8U++c+I5Uwg9ruaR58hc9R1EEgr08Pb4+PJOCHKV2FOgkBHUX0kiNDmOIogObaNu/W0UP/LddtNXdMjrQf26jtxK++/NsxFRuCuujXJp47QpNl9mcj+gSRHzcH5RgdLrBF+zWe+PGnLtlGu557eLCrjhZsS21VznG6PJobos7h5aABRvtYXAKbtFGFvUCLdqfMD+VfsHtTrtm9Rt4Lhea

Steps to reproduce

Please press the respective button to confirm the content of the alert.

What is expected?

The alert will show the same content as the text on the button.

What is actually happening?

For the one using Non Ascii alias in v-for , the alert will only display the text of the first button.

System Info

No response

Any additional comments?

It works well in Vue 2.7.8

[lidlanca]

this is a bug 🐛

the compiler does not detect 果物 as an identifier of the v-for scope

<li v-for="果物 in fluits" :key="果物">
          <button @click="onClick(果物)">{{ 果物 }}</button>
        </li>

and caches the handler

  onClick: _cache[0] || (_cache[0] = $event => (onClick(果物)))

handlers should not be cached when there it depends on v-for scoped variables.