HarmonyOS 鸿蒙Next 循环渲染不出内容

HarmonyOS 鸿蒙Next 循环渲染不出内容 大佬们求助一下我这个循环渲染为啥不能把列表里的内容显示？

export default class ItemData{
  title_1:Resource;//标题
  title_2:Resource;//进度
  title_3:Resource;//日期
  //constructor这个是关键字，类似于构造函数
  constructor(title_1:Resource,title_2?:Resource,title_3?:Resource)
  {
    this.title_1=title_1;
    this.title_2=title_2;
    this.title_3=title_3;
  }
}

import ItemData from '../pages/ListItem_class'

export class MainViewModel{
  getSettingListData():Array<ItemData> {
    let settingListData:ItemData[]=[
      new ItemData($r("app.string.Objective_1"),$r("app.string.percent_100"),$r("app.string.Time_1")),
      new ItemData($r("app.string.Objective_2"),$r("app.string.percent_75"),$r("app.string.Time_2")),
      new ItemData($r("app.string.Objective_3"),$r("app.string.percent_50"),$r("app.string.Time_3")),
      new ItemData($r("app.string.Objective_4"),$r("app.string.percent_25"),$r("app.string.Time_4"))
   ]
    return settingListData;
  }
}

export default new MainViewModel();

import ItemData from '../pages/ListItem_class'
import MainViewModel from '../pages/ListItem_data'

@Entry
@Component
struct Index {
  @Builder settingCell(item:ItemData) {
    Column() {
      Row() {//
        Text(item.title_1)
          .fontSize(10)
          .fontWeight(FontWeight.Bold)
          .height(50)
          .width(50)
        Column() {
        Text(item.title_2)
          .fontSize(10)
        Text(item.title_3)
          .fontSize(5)
        }//
      }
      //.justifyContent(FlexAlign.SpaceBetween)//对齐
      .borderRadius(10)//圆角
        .justifyContent(FlexAlign.SpaceBetween)//设置对齐方式
        .width('100%')
      //进度条

    }
    .height(100)
    .backgroundColor("yellow")
  }

  build() {

      Column() {
        Row(){
          Text('子目标')
            .fontSize(20)
            .fontWeight(FontWeight.Bold)

          Text('编辑')
            .fontSize(15)
            .fontColor('blue')
        }
        .width("95%")
        .justifyContent(FlexAlign.SpaceBetween)
        .backgroundColor("#66FFCC")


        Column(){
          List({space:10}){
            ForEach(
              MainViewModel.getSettingListData(),//循环渲染
              (item:ItemData)=>{ 
                ListItem(){
                  this.settingCell(item)
                }
              },item=>JSON.stringify(item)
            )
          }
          .width('100%')
          .height('50%')
          .divider({strokeWidth:20,color:'green'})//分割线
          .borderRadius(30)//圆角
        }
        .backgroundColor("#CC33CC")
      //多个目标项
      }
      .width('100%')

  }
}

结果是这样的，还有这个圆角也没效果