why can not use for statement in inline handlers

[JetLua]

<script setup>
import { reactive } from 'vue'

const state = reactive({
  list: [1, 2, 3]
})

const {log} = console
</script>

<template>
  <h1>{{ msg }}</h1>
  <button @click="() => {
         for (const x of state.list) {
                  log(x) // output: undefined
        }         
  }">Click</button>
</template>

SFC Playground

[chenxch]

By looking at js, you will find that this should be a scope pointing problem. After compilation and conversion, x is not directly output but _ctx.x. If you use forEach, this problem does not exist. Maybe this is a bug of vuejs?
Of course, this way of writing is not recommended (I think you must know