React首次加载时setState更新状态数组仅保存最后一个元素问题

• 核心是setState的异步更新特性导致：当你在短时间内连续调用setState时，React会将多个更新合并到同一个批次执行。你当前的写法直接读取this.state.decorators，拿到的始终是批次更新前的旧值（两次调用时拿到的都是初始空数组），后一次的更新会直接覆盖前一次的结果，最终只会保留最后一个添加的装饰器，并非是调用过于频繁导致。
• 额外你代码还存在两处语法/变量名错误：
  1. state初始化时属性赋值应该用冒号:而非等号=，正确写法为decorators: [], polyPaths: []
  2. render中遍历的数组名写错，你state定义的是polyPaths，但map用的是this.state.polyPath，少了末尾的s

1. 将setState改为函数式更新写法，通过回调参数拿到上一次更新完成后的最新state，确保每次添加都是基于最新的数组：

addDecorator = (dec) => {
  // 用prevState获取上一轮更新后的最新状态
  this.setState(prevState => ({
    decorators: [...prevState.decorators, dec]
  }))
}

2. 修正前面提到的state初始化语法错误、以及遍历数组的变量名错误，避免潜在的渲染异常。

内容的提问来源于stack exchange，提问作者Daniel