Cannot use instance member 'service' within property initializer; property initializers run before 'self' is available

Question

Im trying to get longitude and latitude from struct gService and set it on a Map. But can't initialize @State var region, because of error "Cannot use instance member 'service' within property initializer; property initializers run before 'self' is available" on service.latitude and service.longitude

struct DetailCardView: View {

let service: gService

@State var region = MKCoordinateRegion(center: CLLocationCoordinate2D(latitude: service.latitude, longitude: service.longitude), span: MKCoordinateSpan(latitudeDelta: 0.0033, longitudeDelta: 0.0033))

var body: some View {

Map(coordinateRegion: $region, annotationItems: [MapPoint(coordinates: CLLocationCoordinate2D(latitude: service.latitude, longitude: service.longitude))]) { location in
                    MapAnnotation(coordinate: location.coordinates) {
                        Circle()
                            .stroke(.red, lineWidth: 3)
                            .frame(width: 50, height: 50, alignment: .center)
                    }
                }

I googled this problem, but there were different cases.

Answer 1

Basically, what the compiler is saying is that "I'm still creating the instance of your DetailCardView, I don't know yet what is the value of service so I can't use it in the region".

The solution is to pass the service to a constant that will be used to initialise both properties. You need to create an initializer for your View where you pass this constant.

Here's how it looks:

let service: gService


// Rather than service.longitude and service.latitude, use a dummy value, like 0.0
// Recommended this var to be private
@State private var region = MKCoordinateRegion(center: CLLocationCoordinate2D(latitude: 0.0, longitude: 0.0), span: MKCoordinateSpan(latitudeDelta: 0.0033, longitudeDelta: 0.0033))

// Here's your initializer
init(service: gService) {
    self.service = service      // Use service to initialise self.service

    // Use service - and NOT self.service - to initialise region
    region = MKCoordinateRegion(center: CLLocationCoordinate2D(latitude: service.latitude, longitude: service.longitude), span: MKCoordinateSpan(latitudeDelta: 0.0033, longitudeDelta: 0.0033))
}

var body: some View {
...    // The rest of your code

Another method you can try is to drop the init() and set the region when the view appears, like this:

let service: gService


// Rather than service.longitude and service.latitude, use a dummy value, like 0.0
// Recommended this var to be private
@State private var region = MKCoordinateRegion(center: CLLocationCoordinate2D(latitude: 0.0, longitude: 0.0), span: MKCoordinateSpan(latitudeDelta: 0.0033, longitudeDelta: 0.0033))

var body: some View {
    Map(coordinateRegion: $region, annotationItems: [MapPoint(coordinates: CLLocationCoordinate2D(latitude: service.latitude, longitude: service.longitude))]) { location in
                    MapAnnotation(coordinate: location.coordinates) {
                        Circle()
                            .stroke(.red, lineWidth: 3)
                            .frame(width: 50, height: 50, alignment: .center)
                    }
        .onAppear {
            region = MKCoordinateRegion(center: CLLocationCoordinate2D(latitude: service.latitude, longitude: service.longitude), span: MKCoordinateSpan(latitudeDelta: 0.0033, longitudeDelta: 0.0033))
        }
                }