Mutating Array in setState: Best Practices?

[Cassius28]

I understand that avoiding the mutation of state is very important in react, although when it comes to avoiding the mutation of arrays in setState, I am wondering how necessary that is.

I was able to implement a way to change an entire array (length of 2) without mutating the original. However, it seems like a lot of unnecessary work and is not practical for large data sets. I am learning and experimenting and would like to know what the best practices are.

Can someone let me know if it is generally okay to completely update an array in state like the first example that I commented out, or if the longer way with the map method is a “better practice” ? Thank you

  // setMapPosition([geoLocationPosition.lat, geoLocationPosition.lng])
  // ? implemented callback so it returns an altered copy and doesnt
  // ? mutate the original array
  setMapPosition(prev => prev.map((item, index) => {
    if(index === 0) {
      item = geoLocationPosition.lat
    }
    else if(index === 1) {
      item = geoLocationPosition.lng
    }
    return item
  }))
  console.log(mapPosition);

[Sylvant]

It doesnt look like you are mutating anything, unless I am missing something. Whatever you pass to the setter will be used as the value. Passing the callback to the setter is simply the means to ensure you work with the most accurate state and not an outdated value.
For your case, it doesnt look like using callback is of any need.
Mutation would be if you do lets say:

mapPosition[0] = geoLocationPosition.lat