HarmonyOS 鸿蒙Next在列表循环渲染的场景下使用点光源pointlight效果

HarmonyOS 鸿蒙Next在列表循环渲染的场景下使用点光源pointlight效果 官方的示例没有一个正常的使用场景，在使用foreach进行循环渲染时点光源效果会出错，要不点不亮，要不点一个之后，所有元素都亮了，以下是一个可参考的基于真实业务场景的点光源pointlight效果的实现方式

import { hdsEffect } from '@kit.UIDesignKit';

@Entry
@ComponentV2
struct Index {
  @Local lightStates: hdsEffect.PointLightSourceType[] = new Array(30).fill(hdsEffect.PointLightSourceType.NONE);
  @Local button_gradient_state: hdsEffect.PressShadowType[] =new Array(30).fill(hdsEffect.PressShadowType.NONE);
  @Local lightIntensity: number[] =new Array(30).fill(0);

  //list中循环渲染的UI元素
  @Builder lightitem(index: number){
    Column()
      .width(60)
      .height(60)
      .borderRadius(80)
      .backgroundColor('#33ffffff')
      //设置光源
      .visualEffect(new hdsEffect.HdsEffectBuilder()
        .pointLight({
          sourceType: this.lightStates[index],
          illuminatedType: hdsEffect.PointLightIlluminatedType.BORDER_CONTENT
        })
        .buildEffect())
      //设置光源触发
      .onTouch((event: TouchEvent) => {
        if (event.type === TouchType.Down) {
          this.lightStates[index] = hdsEffect.PointLightSourceType.BRIGHT;
          this.button_gradient_state[index]=hdsEffect.PressShadowType.BLEND_GRADIENT;
        } else if (event.type === TouchType.Up || event.type === TouchType.Cancel) {
          this.lightStates[index] = hdsEffect.PointLightSourceType.NONE;
          this.button_gradient_state[index]=hdsEffect.PressShadowType.NONE;
        }
        //设置亮灭过渡动画
        const animationConfig: AnimateParam = {
          duration: 300,
          curve: Curve.EaseOut,
          iterations: 1,
          playMode: PlayMode.Normal,
        };

        if (event.type === TouchType.Down) {
          this.getUIContext()?.animateTo(animationConfig, () => {
            this.lightIntensity[index]=2
          })
        } else if (event.type === TouchType.Up || event.type === TouchType.Cancel) {
          this.getUIContext()?.animateTo(animationConfig, () => {
            this.lightIntensity[index]=0
          });
        }
      })
  }

  build() {
    Column({ space: 10 }) {
      List(){
        ForEach(new Array(30).fill(0), (item: number, index: number) => {
          ListItem(){
            this.lightitem(index)
          }
        })
      }
      //将list设置为受光体
      .lanes(5)
      .visualEffect(new hdsEffect.HdsEffectBuilder()
        .pointLight({ illuminatedType: hdsEffect.PointLightIlluminatedType.BORDER_CONTENT })
        .buildEffect())
    }
    .backgroundColor(Color.Black)
    .width('100%')
    .height('100%')
    .justifyContent(FlexAlign.Center)
  }
}