How to update indexes in reactive array in Vue 3 composition API

Question

I want to change the vue options api code to composition api. The options api code is follows

data(){
return{
successData: [],
errorData: []
}
}
methods: {
generateData(){
timeStampArray.forEach((ts,index) => {
  let fd = resultArray.filter(vital => vital.created_at >= ts && vital.created_at < ts+60)
  this.successData[index] = fd.filter(val => val.is_success === true)? filteredData.filter(val => val.is_success === true).length : 0
  this.errorData[index] = fd.filter(val => val.is_success === false)? filteredData.filter(val => val.is_success === false).length : 0
})
}
}

I want to chage this to composision apo code? Which is better using ref or reactive?

I tryied this code? Is it right?

let successData =ref([]);
let errorData =ref([]);

generateData(){
timeStampArray.forEach((ts,index) => {
  let fd = resultArray.filter(vital => vital.created_at >= ts && vital.created_at < ts+60)
  successData.value[index] = fd.filter(val => val.is_success === true)? filteredData.filter(val => val.is_success === true).length : 0
  errorData.value[index] = fd.filter(val => val.is_success === false)? filteredData.filter(val => val.is_success === false).length : 0
})

Is this approach is good?