对于网格布局如何实现自定义的分割线？

@Entry
@Component
struct Indexdfgdgfh {
  @State data: string[][] = []
  @State colNum: number = 2
  getData() {
    this.data = []
    let arr: string[] = []
    for (let index = 0; index < 20; index++) {
      arr.push(`第${index}项`)
    }
    let arr2: string[] = []
    arr.forEach((item, index) => {
      arr2.push(item)
      if (index % this.colNum == this.colNum - 1) {
        this.data.push(arr2)
        arr2 = []
      }
    })
  }
  aboutToAppear(): void {
    this.getData()
  }
  build() {
    Column() {
      Column() {
        ForEach(this.data, (item: string[], strArrIndex) => {
          Row() {
            ForEach(item, (str: string, strIndex) => {
              Column() {
                Text(str)
              }
              .alignItems(HorizontalAlign.Center)
              .justifyContent(FlexAlign.Center)
              .layoutWeight(1)
              if (strIndex < item.length - 1) {
                Divider()
                  .vertical(true)
                  .padding({
                    top: 10,
                    bottom: 10
                  })
              }
            })
          }
          .width("100%")
          .height(40)
          .border({
            width: {
              bottom: strArrIndex + 1 === this.data.length ? 0 : 1
            }
          })
        })
      }
      .width("100%")
      .borderRadius(5)
      .backgroundColor(Color.Pink)
      .padding({
        left: 20,
        right: 20
      })
      Button('变成3列').onClick((event: ClickEvent) => {
        this.colNum = 3
        this.getData()
      })
    }
    .height("100%")
    .width("100%")
    .padding({
      left: '10%',
      right: '10%'
    })
  }
}