数组长度大于100时,在 v-for中修改数组项属性报错

[javie5]

Vue version

vue.3.5.0-beta.3

Link to minimal reproduction

https://play.vuejs.org/#eNp9U81u00AQfpXRikMqJU5K4ZKmlQr0AOJPLTeMVBNP2m3ttbW7TlNFkRBUlAsFBBVQISGhCrhU5YBQVFrxMnECb8F4XdsRtD159pu/b2Y+d9lcGFrtCFmdNVRT8lDP2gI7YSA1uNhyIk9D1xYArqOd0kRqA0jUkRTZK/Xe5ErX4f6Dcgr2ppNvz7z8IBIa3SJfr3BlLaO+ZqqOR6JeCVxVzwIpZlFveFjiGv0y8LwCAG+BQS2VBIw5cnqF13QwrPLs3AczsFSp8PqFLu9NL+WRZ9VIeRpmKfuicbUaH78e7nwb/dz8s/MrPvwc730ZHG5P1mrDtz/K8Yev2TTx1jGFDfr78dP3ZzMZHO3GB0e/t77DLafD/cgnTs1IKt5GiEJaOSrAThPRRRe4gGbgh4FAoaGxgKE3a412N+Ojx3G/XxAc7u+lELGhs1tT1mWrVnmI2rEulv8Bpkz+o/jFq9H2QfzpSbz/jrKmR28+Dp+9TKFB/3mKZh3MYTM10DwC12FOSmejNFmbnLBa3PNKE5bvhKXiojOzp9yuC/xEQmbpqUZO7pecgIxGNVdsg2qFHm2EbICGy9vQrrQCOWOzog+tKGNmM6iv4Qa5eWKa7dPjP7XZzBQE6BIfwqBnCDSq1CFpWx3ry8pMq2YgWnzZWlWBoF/KjGWz5DDcQ3kn1DwQyma5vG3meF6wfsNgWkZ4Ii7KWcHm2in4quokmM3uSlQo22iz3KcdSROk7vnF29ghO3f6gRt5FH2OcwFV4EUJxzTsSiRcoj0WZ9heJ5lJzcXyPTXf0ShUNlRCtPiVbUZ6unrO6AXdKeuSyaOzst5fb+meLQ==

Steps to reproduce

<script>
export default {
  data() {
    return {
      dataList: [],
    };
  },
  mounted() {
    this.getData();
  },
  methods: {
    getStyle(item, i) {
      if (item.style) {
        return item.style;
      }
      item.style = `--i:${i};`;
      return item.style;
    },
    getData() {
      //当数组长度大于100时,在getStyle函数中写 item.style = `--i:${i};`;会导致 Maximum recursive updates exceeded in component <Repl>.的异常
      //此异常在vue.3.5.0-beta.2,vue.3.5.0-beta.3的开发环境存在;生成环境不存在
      this.dataList = new Array(101).fill().map((item, i) => {
        return { i };
      });
    }
  },
}
</script>
<template>
  <div v-for="(item, i) in dataList" :key="i" :style="getStyle(item, i)">
    {{ item }}
  </div>
</template>

What is expected?

https://play.vuejs.org/#eNp9U81u00AQfpXRikMqJU5K4ZKmlQr0AOJPLTeMVBNP2m3ttbW7TlNFkRBUlAsFBBVQISGhCrhU5YBQVFrxMnECb8F4XdsRtD159pu/b2Y+d9lcGFrtCFmdNVRT8lDP2gI7YSA1uNhyIk9D1xYArqOd0kRqA0jUkRTZK/Xe5ErX4f6Dcgr2ppNvz7z8IBIa3SJfr3BlLaO+ZqqOR6JeCVxVzwIpZlFveFjiGv0y8LwCAG+BQS2VBIw5cnqF13QwrPLs3AczsFSp8PqFLu9NL+WRZ9VIeRpmKfuicbUaH78e7nwb/dz8s/MrPvwc730ZHG5P1mrDtz/K8Yev2TTx1jGFDfr78dP3ZzMZHO3GB0e/t77DLafD/cgnTs1IKt5GiEJaOSrAThPRRRe4gGbgh4FAoaGxgKE3a412N+Ojx3G/XxAc7u+lELGhs1tT1mWrVnmI2rEulv8Bpkz+o/jFq9H2QfzpSbz/jrKmR28+Dp+9TKFB/3mKZh3MYTM10DwC12FOSmejNFmbnLBa3PNKE5bvhKXiojOzp9yuC/xEQmbpqUZO7pecgIxGNVdsg2qFHm2EbICGy9vQrrQCOWOzog+tKGNmM6iv4Qa5eWKa7dPjP7XZzBQE6BIfwqBnCDSq1CFpWx3ry8pMq2YgWnzZWlWBoF/KjGWz5DDcQ3kn1DwQyma5vG3meF6wfsNgWkZ4Ii7KWcHm2in4quokmM3uSlQo22iz3KcdSROk7vnF29ghO3f6gRt5FH2OcwFV4EUJxzTsSiRcoj0WZ9heJ5lJzcXyPTXf0ShUNlRCtPiVbUZ6unrO6AXdKeuSyaOzst5fb+meLQ==

What is actually happening?

Uncaught (in promise): Maximum recursive updates exceeded in component . This means you have a reactive effect that is mutating its own dependencies and thus recursively triggering itself. Possible sources include component template, render function, updated hook or watcher source function.

System Info

No response

Any additional comments?

No response

[edison1105]

core/packages/runtime-core/src/scheduler.ts

Line 264 in 4b608a9

`Maximum recursive updates exceeded${

This is validation in the development environment, not in the production environment.